quieter
Installation
SKILL.md
Context: this sub-skill is one lens of the broader ui-craft skill. If the ui-craft skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below.
Quiet the UI at the target the user described. Load the ui-craft skill.
Overlap flag: /quieter is about visual weight (accents, type, shadows, motion). /distill is about content and structure (cutting sections, words, props). If the UI is shouting because there's too much of it, run /distill first.
Pass in order:
- Count accents per viewport. Cut to 1-3. The primary CTA keeps its accent; everything else goes neutral unless it's a true semantic state (success/warning/danger on a real status).
- Soften type. Headings: weight 800 → 600, size 72 → 56, tracking -0.04em → -0.02em. Don't remove hierarchy — compress the range.
- Depth. Replace hard drop shadows with subtle ambient + direct (see
references/modern-css.md), or switch to 1px borders. Never both. - Motion. Remove any animation that isn't communicating state or hierarchy. Decorative scroll reveals, idle float/bob, mouse-tracking glows → gone.
- Color. Mute any purely decorative color. Background patterns, tinted cards without meaning, colored left borders on every list item → gone.
- Density. If every section is full-bleed and high-contrast, let some breathe — increase section padding, reduce contrast on secondary surfaces.