Luxury Design Taste — SkyyRose

Brand truth: Oakland-rooted luxury streetwear — NOT European maison minimalism. Canonical references: Kith, Oaklandish, Culture Kings, Fear of God, Palm Angels. Never Chanel/Dior/Celine lineage.

When to use

• A surface on skyyrose.co (theme templates, collection pages, PDP, hero sections) or the devskyy.app dashboard is being designed, restyled, reviewed, or "elevated".
• A mockup or design reference HTML is being graded against brand canon.
• A motion/animation pass is being added to any SkyyRose surface.
• Another design skill (impeccable, ui-ux-pro-max, frontend-design) produced output that must be filtered through SkyyRose canon before shipping.

When NOT to use: generic frontend work with no SkyyRose brand surface (frontend-design owns that); native iOS SwiftUI/UIKit (liquid-glass-design); 3D scene architecture (immersive-interactive-architect / skyyrose-3d-web-os); product-copy or SEO work (skyyrose-market plugins).

Inputs

Required before any taste judgment. If any is absent, stop and obtain it — never proceed on memory.

Input	Canonical location	If absent
Brand tokens + fonts	CLAUDE.md §6 Brand; wordpress-theme/skyyrose-flagship/theme.json; data/brand/typography.json	Stop — read them; memory rots, tokens do not
Per-collection identity	wordpress-theme/skyyrose-flagship/data/logo-registry.json → collections.<slug>	Stop — this is the SOT (see docs/CLAUDE.md); never invent a palette
Visual reference canon	docs/brand/visual-references.md (The Five)	Stop — read it; proposing European-maison references is a canon violation
Product imagery, if any product appears	data/sot-images.json via skyyrose.core.sot_images	Stop — filenames are not identity; SOT-resolve or do not show the product
The surface under review	the actual file(s), or a live URL	Stop — taste review of an unread surface is a guess

The garment is the protagonist

Every surface serves the product photography. Copy, chrome, and motion are supporting cast.

• Imagery: on-model shots outrank ghost mannequins outrank flat lays. Full-bleed where possible.
• NEVER: urgency timers, countdown clocks, related-products/"wears with" cross-sell (retired canon), fake scarcity, discount-brand energy.
• Hero titles = brand-script lockup IMAGES (assets/images/hero-overlays/ for BR/LH/SIG, assets/images/logos/ for Kids), never type-rendered. Fonts are for interior text only.

Restraint rules (what separates luxury from template)

• One accent per collection surface: Signature #D4AF37, Black Rose #C0C0C0, Love Hurts #DC143C, Kids Capsule #B76E79, on dark #0A0A0A. Two accents on one screen = flea market.
• Whitespace is the luxury signal. If a section feels empty, that's usually correct. Density is for dashboards, not storefronts.
• Type scale: big display moments (Archivo, expanded via font-variation-settings: 'wdth' 125) + tiny wide-tracked utility labels (Anton, 10-13px, 4-8px letter-spacing). The MIDDLE sizes are where generic creeps in — avoid 16-20px workhorse type on marketing surfaces.
• Materials: glass (rgba white 0.04-0.08 + blur), hairline borders (1px, low-alpha white), metallic gradients ONLY on brand-token hues. No drop shadows heavier than 0 24px 80px rgba(0,0,0,.4) on dark.
• Contrast is a brand constraint: crimson #DC143C on #0A0A0A measures below WCAG AA for body text (see Verification) — fills/borders/glows only; de-emphasised text uses --color-text-muted (#B3B3B3, 9.44:1), never low-alpha white guessed by eye.

Motion taste

• Ease: cubic-bezier(.16,1,.3,1) (the house curve, --ease-luxury). Duration 0.6-1.2s for reveals; nothing snaps.
• Motion must have narrative purpose: reveal on scroll, parallax depth, slow zoom (heroZoom-style 20-30s ambient). Decorative twitching = slop.
• Everything animated pauses under @media (prefers-reduced-motion: reduce) and stays legible when frozen.
• Auto-scrolling media (marquees, strips) must remain background texture: opacity ≤ 0.25 behind content, masked edges, and never compete with the lockup.

Imagery treatment

• Product pixels are identity — verify garment matches SKU (eyes-on, reading pixels) before any imagery ships. Wrong-garment is the #1 recurring defect (lh-005 fanny-pack hallucination).
• Editorial treatment for background/ambient use: desaturate 30-40%, brightness 0.7-0.8, contrast +5%, vignette-mask edges. Full color is reserved for the product being sold.
• Aspect discipline: portrait 3:4/2:3 for garments, wide only for scenes. Never stretch, never letterbox with visible bars.

Slop detectors (instant fail)

Centered-everything symmetric layouts; gradient text on headings; emoji in UI; 12-col bootstrap rhythm; uniform border-radius 8px everywhere; stock-photo energy (non-brand models, generic city b-roll); grey-on-white "SaaS clean" palettes; identical card grids without one broken/featured element for rhythm.

Procedure

1. Load inputs (table above). Read the surface's actual CSS/HTML/template files — never review from a description.
2. Identify the collection register from the registry's collections.<slug> entry for the surface; note its single permitted accent hex.
3. Grade against each section above in order: protagonist → restraint → motion → imagery → slop detectors. Record each violation as file:line + the rule it breaks.
4. For every proposed change, state which rule it serves in one line. A change serving no rule is scope creep — drop it.
5. If the surface is theme CSS/JS, every edit requires cd wordpress-theme && npm run build — production serves .min (see skyyrose-design:theme-min-build).
6. Run Verification below before reporting the pass/fail verdict.

Verification

Taste is judged; these floors are measured. A surface that fails a floor fails the review regardless of how it "feels".

1. Contrast floor — measure, never eyeball:

python3 -c "
def lum(h):
    r,g,b=[int(h[i:i+2],16)/255 for i in (0,2,4)]
    f=lambda c: c/12.92 if c<=0.03928 else ((c+0.055)/1.055)**2.4
    r,g,b=f(r),f(g),f(b); return 0.2126*r+0.7152*g+0.0722*b
fg,bg='DC143C','0A0A0A'
l1,l2=sorted((lum(fg),lum(bg)),reverse=True)
print(f'{(l1+0.05)/(l2+0.05):.2f}:1')
"

PASS: every body-text fg/bg pair ≥ 4.5:1, large-display pairs ≥ 3:1. [repro] Observed 2026-07-28: #DC143C on #0A0A0A → 3.97:1 — below AA, which is WHY crimson is fills/borders/glows only.

2. Cut-font guard — the four retired fonts never return as declarations:

grep -rniE "font-family[^;]*(playfair|cormorant|bebas|yellowtail)" \
  wordpress-theme/skyyrose-flagship/assets/css wordpress-theme/skyyrose-flagship/theme.json

PASS: exits 1, prints nothing. [repo] (Observed 2026-07-28: clean. A bare name-grep false-positives on the fonts.css:13 changelog comment — scope to font-family declarations as above.)

3. Accent-discipline census — the palette in use must be the brand palette:

grep -rhoE '#[0-9a-fA-F]{6}\b' wordpress-theme/skyyrose-flagship/assets/css/*.css \
  | grep -v '.min.css' | tr 'A-F' 'a-f' | sort | uniq -c | sort -rn | head -8

PASS: top counts are brand tokens (#b76e79 #0a0a0a #d4af37 #dc143c #c0c0c0) + neutrals; a non-token hue appearing in the top ranks is a drift finding. [repo]

4. Eyes-on render (mobile 390px + desktop) via Playwright/Chrome DevTools is a BROWSER aspect this skill cannot self-execute headlessly. A SKIP is not a PASS — flag it explicitly for the caller or run verify:theme aspect responsive in a browser-capable session. Severity claims about the live site require that [live] probe.

Rule inherited from docs/skill-authoring-standard.md: if any check above errors or times out, its empty output is an artifact, not a pass — re-run by hand. Before attributing a census/grep finding to your change, run the same command against a pristine tree (git archive HEAD wordpress-theme | tar -x -C <scratch>), never git stash.

Worked example

Real session, 2026-07-28, this repo. Grading the theme's token discipline before a design pass:

$ grep -rhoE '#[0-9a-fA-F]{6}\b' wordpress-theme/skyyrose-flagship/assets/css/*.css \
    | grep -v '.min.css' | tr 'A-F' 'a-f' | sort | uniq -c | sort -rn | head -8
 478 #b76e79
 146 #0a0a0a
 103 #d4af37
  49 #050505
  48 #ffffff
  46 #dc143c
  31 #c0c0c0
  14 #2a2a2a

Verdict: top 8 are all brand tokens or neutrals (#050505/#2a2a2a are dark-surface steps) — no palette drift [repo]. The contrast probe on the same session returned 3.97:1 for crimson-on-dark [repro], confirming the fills/borders/glows-only rule is load-bearing, not stylistic.

Failure modes

• Wrong-garment imagery ships — the #1 recurring defect (lh-005; bug-096 ×30 hallucinated brand canon on 30 SKUs). Cause: trusting filenames/manifests instead of reading pixels. Fix: SOT-resolve + eyes-on before anything ships.
• "Looks like a plausible BR/LH look" passes QC — lenient-QC defect (bug-276 class); cost 16cr of bad hero clips. QC only against the canonical reference asset, side-by-side.
• Crimson used for body text — reads fine to the eye on a bright monitor, fails AA at 3.97:1. Always measure (Verification #1).
• Cut fonts reintroduced via a well-meaning "elegant serif" suggestion (ui-ux-pro-max recommends Cormorant for luxury queries — observed 2026-07-28). Filter every external recommendation through Verification #2.
• Second accent creeps in when composing sections from different collections onto one surface. One accent per surface, always.
• Stale .min shipped — source CSS edited, .min not rebuilt; production serves .min (bug-287 adjacent). npm run build + verify:theme --only min-sync closes it.

Precedence

When design sources disagree: project .impeccable.md > this skill > impeccable > ui-ux-pro-max tables > interactive-web-development examples. ui-ux-pro-max's html-tailwind default and Liquid Glass recommendation are overridden for this project (vanilla CSS; glassmorphism banned outside product-card-holo). impeccable's reflex-font rejection does not apply to locked brand fonts (Archivo, Hanken Grotesk, Anton, Cinzel, Inter, plus the per-collection name-scripts: SkyyRose Black Rose Script, SkyyRose Love Hurts Graffiti, Pinyon Script, Grand Hotel — lockup images only, never interior).