| name | fashion-styling |
| description | Web/UI theming guide for a women's-fashion boutique **website** — a frontend design system applied phase by phase (typography, color, layout, components, animation, polish) for a modern editorial aesthetic. Use when styling or restyling a fashion storefront/landing UI: type scale, palette, grid/spacing, component look (cards, nav, product displays, CTAs), and motion. This is **CSS/UI theming, NOT shoot/wardrobe styling** — for model/garment styling on real shoots use `fashion-production` (styling phase). Pairs with `frontend-design` and `tailwind-design-system`.
|
| metadata | {"priority":4} |
Fashion Styling (web/UI boutique theme)
Scope: this is a frontend design-system / UI theme for a fashion boutique website —
not shoot or wardrobe styling. For on-set model/garment styling, casting, and HMU, use the
fashion-production hub (styling phase). For general UI work,
see frontend-design (now includes the Tailwind design-system reference).
Phase-by-phase styling guide for a women's-fashion boutique website theme. Modern editorial
aesthetic with elegant typography, geometric accents, and sophisticated animations.
Aesthetic Pillars
- Typography: Elegant serif for headings, clean sans for body
- Geometry: Accent shapes, diagonal lines, frame compositions
- Animation: Subtle reveals, hover states, scroll-triggered motion
- Palette: Muted neutrals with accent color pops
- White space: Generous, editorial-level spacing
Phase Application
Apply phases sequentially:
- Typography — Set type scale, pairings, hierarchy
- Color — Define palette, accents, backgrounds
- Layout — Grid, spacing, responsive breakpoints
- Components — Cards, navigation, product displays, CTAs
- Animation — Entry, hover, scroll, loading states
- Polish — Micro-interactions, edge cases, accessibility
