Apply design tokens, typography, and spacing to align frontend features with a design system.
npx skills add https://github.com/celanthe/clarion --skill normalize-celanthe
Please help me install this Agent Skill. Skill: normalize Source: https://github.com/celanthe/clarion/tree/main/.agents/skills/normalize Command: npx skills add https://github.com/celanthe/clarion --skill normalize-celanthe
Normalize design to match your design system and ensure consistency across UI patterns, tokens, and typography, reducing drift between components and documentation.
Provide the target feature name and design-system context to generate a normalization plan and implementation guidance.
High-intent search queries and answers about installing and using this skill.
Align UI components by applying design tokens, typography, and spacing patterns. This normalization process ensures token-driven styling and consistency checks, reducing visual drift across frontend features.
Design system normalization is the process of standardizing pages, routes, and widgets to match established design patterns. It applies tokens and accessibility considerations to maintain a cohesive product experience across platforms.
Check design consistency by identifying deviations from established UI patterns. The process proposes concrete refactors and generates a step-by-step normalization plan to execute design system alignment.
Create a normalization plan by providing the target feature name and design-system context. This generates actionable implementation guidance with concrete steps for design and frontend teams to execute.
Yes, design system normalization applies to frontend features and UI components including pages, routes, and widgets. It ensures standardization across platforms by enforcing token-driven styling and accessibility considerations.
mrodrigues1Define visual design systems using typography, color, spacing, and iconography.
TheSoftwareHouseImplement accessible UI components using design tokens and semantic HTML.
benshapyroGenerate TypeScript React components and hooks with standardized patterns for state management and composition.
artivillaCompare UI code against Rauno Freiberg's interface guidelines to identify deviations.
