Automate UI design systems with component libraries and WCAG AA tokens.
npx skills add https://github.com/jc180105/.opencode --skill ui-designer-jc180105
Please help me install this Agent Skill. Skill: UI Designer Source: https://github.com/jc180105/.opencode/tree/main/.opencode/skills/design-ui-designer Command: npx skills add https://github.com/jc180105/.opencode --skill ui-designer-jc180105
Create and maintain pixel-perfect, accessible UI systems that scale across brands while ensuring consistency and efficient collaboration between design and development teams.
Provide a starter design-system outline and a first-pass component library for a brand.
High-intent search queries and answers about installing and using this skill.
A design system with scalable tokens ensures brand consistency by automating component library creation, defining token variables, and applying responsive design and accessibility rules across web and mobile platforms.
Generating handoff-ready specifications requires documentation and QA processes built into the component library workflow, enabling development teams to implement pixel-perfect interfaces with accurate design tokens and responsive behavior.
Ensuring UI design meets WCAG AA accessibility standards involves integrating accessibility-first design principles directly into component libraries, verifying color contrast, scalable typography, and responsive behavior across web and mobile interfaces.
A single component library supports responsive design across web and mobile when it uses scalable design tokens and responsive behavior definitions, allowing interfaces to adapt while maintaining brand consistency and accessibility standards.
Setting up dark mode theming requires defining scalable design tokens that accommodate multiple themes while applying accessibility-first principles to maintain WCAG AA contrast compliance across light and dark modes in your component library.
A formal design system is needed when product teams require brand-consistent interfaces, scalable tokens, and accessible components across web and mobile, whereas individual UI components lack the coordinated token definitions and handoff documentation needed for team collaboration.
daffy0208Design cohesive brand identities with SVG logos, color palettes, and typography systems.
ydnikolaevGenerate Tailwind config, theming, and shadcn components from design tokens.
alex-voloshin-devStandardize UI/UX design systems and WCAG 2.2 AA accessibility compliance through structured auditing and documentation workflows.
GDSDNGenerate pattern library documentation from UI component metadata.
