Codify Sworm design tokens and component recipes to prevent UI drift.
npx skills add https://github.com/TophC7/Sworm --skill sworm-design
Please help me install this Agent Skill. Skill: sworm-design Source: https://github.com/TophC7/Sworm/tree/main/.claude/skills/sworm-design Command: npx skills add https://github.com/TophC7/Sworm --skill sworm-design
Sworm Design System codifies tokens, surfaces, typography, shadows, motion, and iconography into a single source of truth to prevent UI drift across projects.
Review and align all UI work with the Sworm Design System tokens and primitives whenever editing UI code.
High-intent search queries and answers about installing and using this skill.
To prevent UI drift, you need a single source of truth for design tokens. Codifying tokens, surfaces, and component recipes ensures visual consistency across projects by requiring components to consume shared UI primitives.
Design tokens are codified variables for typography, shadows, motion, and surfaces. They enforce visual consistency by acting as a single source of truth that components consume, preventing misaligned styling across different files.
Refactoring UI components involves aligning them with defined design tokens and primitives. You update component files to consume shared UI primitives and live tokens from your stylesheet, ensuring all visual outputs match the canonical design language.
Yes, you need a canonical design language defined in your documentation and live tokens in your stylesheet. Without these foundational elements established, the design system cannot effectively enforce visual consistency across components.
The best way to manage UI tokens is codifying them into a single source of truth within your stylesheet. Encapsulating rules for shadows, motion, and iconography alongside tokens ensures coherent surfaces and consistent interactions.
Your UI looks inconsistent because components are likely not consuming the live tokens defined in your stylesheet. You must ensure all components use shared UI primitives and align with the canonical design language to prevent drift.
radioactive-labsApply CSS design tokens to standardize UI theming across web application components.
MohammedHTahirReview edited TSX/JSX React components for performance and quality regressions.
corey-alixCreate atomic CSS utility classes using token-based custom properties.
MeechYourGoalsAudit production applications for UX and design-system consistency.
