About quieter
quieter is a ui-craft skill for reducing visual and motion intensity in an existing UI while preserving its hierarchy and accessibility. It guides direct code edits and ends with a review table and updated Craft Read.
Key features
- 01Reduce layout variance
- 02Lower motion intensity
- 03Scale back type and shadows
- 04Limit accent colors and decoration
- 05Preserve hierarchy and accessibility
Use cases
- 01Calming an experimental page layout
- 02Reducing decorative motion on a UI
- 03Softening visual emphasis without flattening hierarchy
Install
Copy the command and run it in a terminal.
npx skills add https:/ / github.com/ educlopez/ ui-craft --skill quieterAfter installing, type/quieterin Claude Code to confirm it loaded.
Details
From the project READMEContext: 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.
Make the UI at $ARGUMENTS quieter. Load the ui-craft skill and read references/craft-intent.md.
Reduce amplitude without gutting hierarchy. Calm ≠ boring.
Apply in order (edit code directly):
- Declare an updated Craft Read — one line: what softened.
- Lower DESIGN_VARIANCE by −1–2 (floor 2). Simplify asymmetric breaks; return to clearer grid rhythm where layout was experimental.
- Lower MOTION_INTENSITY by −1–2 (floor 2). Remove scroll reveals and stagger; keep hover/focus only.
- Visual weight — compress display sizes one step (e.g. 56→48px); reduce shadow depth to hairline or ambient-only; fewer bordered containers.
- Color — pull accent placements toward the 3 minimum; neutralize decorative tints; no new hues.
- Cut decorative motion — idle animations, parallax, floating elements with no job.
Preserve: primary hierarchy, one CTA level, accessibility, states, signature detail only if it carries meaning (else simplify it).
Overlap: for structural cuts (sections, copy), also apply /distill logic. For color strategy, see /colorize.
Output: edit code. Print Review Format table. End with the updated Craft Read line.
Next step: /critique — confirm restraint did not flatten the hierarchy (rung 1).