Analyze and redesign features to align with a defined design system.
npx skills add https://github.com/Youneslahlali/MyWebsite --skill normalize-youneslahlali
Please help me install this Agent Skill. Skill: normalize Source: https://github.com/Youneslahlali/MyWebsite/tree/main/.gemini/skills/normalize Command: npx skills add https://github.com/Youneslahlali/MyWebsite --skill normalize-youneslahlali
This Skill ensures that a given feature's design is consistent with your established design system, improving user experience and brand coherence.
Normalize the user profile component to match the design system.
High-intent search queries and answers about installing and using this skill.
To align new UI components with an existing design system, the design is analyzed for inconsistencies and refactored using established component patterns and design tokens for typography, color, and spacing to ensure visual consistency.
Design token application for UI consistency involves replacing custom styling values with predefined variables for colors, typography, and spacing, ensuring features match the established design system and maintain brand coherence.
Identifying design system inconsistencies involves analyzing a feature's typography, color, layout, components, motion, responsiveness, and accessibility to pinpoint deviations from established patterns and conventions.
Yes, you can refactor custom styled features to match Material Design. The process analyzes the custom styling and applies Material components and design tokens to ensure it looks and feels like the rest of the application.
Yes, design system alignment addresses accessibility and responsiveness. The redesign process specifically targets these areas alongside typography and motion to apply established conventions and user-centered principles.
To normalize a user profile component to match a design system, you need a thorough understanding of your design system documentation and user-centered principles to properly apply the established design tokens and component patterns.
ravnhqValidate UI components against design system tokens and responsive guidelines.
dembrandtConvert a website URL or DESIGN.md into a brand-aligned UI specification with normalized design tokens.
usetheodevAudit, migrate, and catalog React projects using @theokit/ui components.
LschulzesEvaluate UI code against Web Interface Guidelines to detect deviations.
