Document PhiaUI design-system tokens for typography, color, spacing, and theming.
npx skills add https://github.com/charlenopires/PhiaUI --skill phia-design-system
Please help me install this Agent Skill. Skill: phia-design-system Source: https://github.com/charlenopires/PhiaUI/tree/main Command: npx skills add https://github.com/charlenopires/PhiaUI --skill phia-design-system
Design teams need a single source of truth for visual language to maintain consistency across PhiaUI's 829 components and multiple themes, reducing drift and onboarding friction.
Review the design system assets and apply the tokens to a new PhiaUI component following the guidelines described in this skill.
High-intent search queries and answers about installing and using this skill.
Define semantic-token-based theming rules for typography, color, spacing, and shadows to ensure accessibility and dark mode. This approach provides a single source of truth for visual language, maintaining consistency across hundreds of components without external libraries.
Semantic token-based theming uses named tokens for UI elements like typography, color, and spacing instead of hard-coded values. This system ensures responsive behavior, dark mode support, and accessibility guidelines are baked-in, reducing visual drift across multiple themes.
Apply documented design tokens for layout, animation, and spacing to build SaaS dashboards and marketing pages using Tailwind v4. This method enforces modularity constraints and zero external libraries, providing a cohesive visual system for admin panels and developer components.
Yes, you can brand a SaaS admin panel using this design system because it enforces zero external libraries. It specifies modularity constraints and semantic tokens for icons and layout, guiding future component design while maintaining accessibility and responsive behavior.
Establish a single source of truth using design tokens for typography, color, radii, and shadows to maintain consistency across multiple themes. This reduces onboarding friction and visual drift by enforcing strict accessibility and dark mode guidelines across all components.
You need a formal design system with predefined tokens when scaling a UI library to hundreds of components. It ensures cohesive accessibility, dark mode, and responsive behavior across varied use cases like marketing pages and admin panels, preventing visual drift.
algusaemBuild Tailwind CSS design systems with semantic tokens and CVA-based components.
alissimoreApply Nexus design system and Tailwind CSS tokens to UI components.
capaas2Design Tailwind CSS v4 interfaces with CSS-first configuration and responsive utility patterns.
chaitinDefine scalable design system patterns with tokens, themes, and component APIs.
