Claude Code forge-quieter for quieter UI hierarchy
Use your existing type, color, and shadow scales to reduce visual intensity and make primary content easier to identify.
中文Install in Claude Code
Give Claude Code the screen and existing design tokens for type, shades, and elevation.
- Review `.claude/skills/forge-quieter/SKILL.md` and its requirements at the pinned GitHub commit.
- Create `.claude/skills/forge-quieter/` in your project and save the reviewed file as `.claude/skills/forge-quieter/SKILL.md`.
- Start Claude Code from that project's root, then select `/forge-quieter` in the slash menu.
Example task
The secondary banner in calm-18 uses {accent: 600, shadow: 2} and competes with the main button. Weaker tokens are available.What to check
Use {accent: 500, shadow: 1} for the secondary banner. Check that the primary action stands out and banner text stays readable.
Original SKILL.md on GitHub · Updated
Frequently asked question
Should I rebuild the color palette?
Keep the adjustments within the current design range. Use space and heading size as well when adjusting hierarchy.