ui-design-styling
Installation
SKILL.md
ryOS UI Design & Styling
Canonical References
- Implementation spec:
docs/3.3.1-theme-architecture.md - User-facing overview:
docs/3.3-theme-system.md - Token source of truth:
src/styles/themes/tokens.css - Theme CSS import order:
src/styles/themes.css - Tailwind mappings and variants:
tailwind.config.js - Theme metadata/state:
src/themes/,src/stores/useThemeStore.ts,src/hooks/useThemeFlags.ts
Visual values belong in CSS --os-* tokens. TypeScript theme files hold metadata, platform behavior, dark-mode support flags, and wallpaper defaults; do not duplicate palettes in TS or component code.