{"enrichment":{"faq":[{"a":"Ui Design System guides you through building and maintaining modern UI design systems using TailwindCSS for styling, Radix UI for accessible primitives, and shadcn/ui for pre-built components. It covers component architecture, design tokens, responsive layouts, dark mode, and accessibility compliance to create consistent, reusable interfaces.","q":"What is the Ui Design System skill about?"},{"a":"Ui Design System helps you establish a unified framework for consistent component design. It teaches you to leverage TailwindCSS for standardized styling, Radix UI for accessible base primitives, and shadcn/ui for ready-made components. This approach ensures all UI elements follow the same design language and patterns across your entire product.","q":"How do I find or use a UI design system for consistent component design?"},{"a":"Ui Design System provides comprehensive guidance on component guidelines and documentation practices. You'll learn how to structure design tokens, document component APIs, create usage examples, and maintain accessibility standards. The skill covers best practices for making your design system documentation clear and accessible to both designers and developers.","q":"Where can I access design system documentation and component guidelines?"},{"a":"Ui Design System walks you through the entire implementation process. Start by defining your design tokens and color palette using TailwindCSS, build accessible primitives with Radix UI, then compose pre-built components with shadcn/ui. The skill covers component architecture decisions, establishing naming conventions, managing responsive behavior, and implementing dark mode support.","q":"How do I build a design system from scratch?"},{"a":"Ui Design System teaches you to discover and implement reusable components including buttons, forms, modals, navigation, and layout patterns. You'll learn component composition strategies, how to create flexible variants, manage state effectively, and ensure accessibility compliance. The skill emphasizes building patterns that scale across your entire application.","q":"What reusable UI components and patterns does Ui Design System cover?"},{"a":"Ui Design System covers essential tools like TailwindCSS for utility-first styling, Radix UI for unstyled accessible components, and shadcn/ui for styled implementations. Best practices include maintaining design tokens, documenting component APIs, testing accessibility, implementing responsive design, supporting dark mode, and establishing clear governance for your design system.","q":"What design system tools and best practices are included?"}],"shadow_tags":["component-library","design-patterns","ui-framework","style-guide","design-tokens","visual-consistency","reusable-components","design-documentation"],"summary_rewrite":"This skill guides you through building and maintaining modern UI design systems using TailwindCSS for styling, Radix UI for accessible primitives, and shadcn/ui for pre-built components. It covers component architecture, design tokens, responsive layouts, dark mode, and accessibility compliance to create consistent, reusable interfaces."},"gist":{"api_url":"https://skillfed.io/api/skills/samhvw8/dot-claude/ui-design-system.json","as_of":"2025-12-09","description":"UI Design System helps you build production-ready component libraries with TailwindCSS, Radix UI. npx skillfed install samhvw8/dot-claude/ui-design-system","install":{"manual":["git clone https://github.com/samhvw8/dot-claude","cp -r dot-claude ~/.claude/skills/ui-design-system"],"primary":"npx skillfed install samhvw8/dot-claude/ui-design-system","version":"4d15b3ad"},"kind":"skill","mirror_url":"https://skillfed.io/samhvw8/dot-claude/ui-design-system.md","similar":[{"id":"nextlevelbuilder/ui-ux-pro-max-skill/ui-styling","name":"ui-styling","publisher":"nextlevelbuilder/ui-ux-pro-max-skill","url":"https://skillfed.io/nextlevelbuilder/ui-ux-pro-max-skill/ui-styling"},{"id":"ScientiaCapital/skills/frontend-ui-skill","name":"Frontend Ui Skill","publisher":"ScientiaCapital/skills","url":"https://skillfed.io/ScientiaCapital/skills/frontend-ui-skill"},{"id":"yonatangross/orchestkit/ui-components","name":"ui-components","publisher":"yonatangross/orchestkit","url":"https://skillfed.io/yonatangross/orchestkit/ui-components"},{"id":"Mindrally/skills/tailwindcss","name":"tailwindcss","publisher":"Mindrally/skills","url":"https://skillfed.io/Mindrally/skills/tailwindcss"},{"id":"jjyaoao/HelloAgents/frontend-design","name":"Frontend Design","publisher":"jjyaoao/HelloAgents","url":"https://skillfed.io/jjyaoao/HelloAgents/frontend-design"}],"title":"Ui Design System by samhvw8 \u2014 SkillFed","use":{"when":["Ui Design System helps you establish a unified framework for consistent component design.","Ui Design System provides comprehensive guidance on component guidelines and documentation practices."]},"what":{"lead":"UI Design System helps you build production-ready component libraries with TailwindCSS, Radix UI, and shadcn/ui.","rest":"This skill guides you through building and maintaining modern UI design systems using TailwindCSS for styling, Radix UI for accessible primitives, and shadcn/ui for pre-built components. It covers component architecture, design tokens, responsive layouts, dark mode, and accessibility compliance to create consistent, reusable interfaces."}},"id":"samhvw8/dot-claude/ui-design-system","install":{"mode":"external","repo":"https://github.com/samhvw8/dot-claude"},"links":{"html":"https://skillfed.io/samhvw8/dot-claude/ui-design-system","md":"https://skillfed.io/samhvw8/dot-claude/ui-design-system.md","repo":"https://github.com/samhvw8/dot-claude"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":0,"language":"Python","last_updated":"2025-12-09","license":null,"name":"Ui Design System","publisher":"samhvw8","stars":10},"relations":{"similar":[{"id":"binjuhor/shadcn-lar/ui-styling"},{"id":"mrgoonie/claudekit-skills/ui-styling"},{"id":"nextlevelbuilder/ui-ux-pro-max-skill/ui-styling"},{"id":"ScientiaCapital/skills/frontend-ui-skill"},{"id":"yonatangross/orchestkit/ui-components"},{"id":"giuseppe-trisciuoglio/developer-kit/tailwind-design-system"},{"id":"Mindrally/skills/tailwindcss"},{"id":"olehsvyrydov/AI-development-team/ui-designer"},{"id":"jjyaoao/HelloAgents/frontend-design"},{"id":"AnswerZhao/agent-skills/frontend-design"}]},"slug":{"owner":"samhvw8","repo":"dot-claude","skill":"ui-design-system"},"version":"4d15b3ad"}
