Appearance
/impeccable typeset ​
Fresh 🌱Improves typography by fixing font choices, hierarchy, sizing, weight, and readability so text feels intentional. Use when the user mentions fonts, type, readability, text hierarchy, sizing looks off, or wants more polished, intentional typography.
When to use it ​
Reach for /impeccable typeset when the text on a page looks like default typography instead of designed typography. Muddy hierarchy, three sizes that look the same, body copy at 14px, a display font that is actually just Inter bold, headlines with no kerning attention.
Common triggers: “hierarchy feels flat”, “readability is off”, “fonts look generic”.
How it works ​
The skill assesses typography across five dimensions:
- Font choices: are you using invisible defaults (Inter, Roboto, Arial, Open Sans), does the typeface match the brand, are there more than 2 to 3 families.
- Hierarchy: are heading, body, and caption clearly different at a glance, is the size contrast at least 1.25x between steps, are weight contrasts legible.
- Sizing and scale: is there a coherent type scale, does body text meet 16px minimum, is the scale fixed-rem for app UIs or fluid-clamp for marketing pages.
- Readability: line length 45 to 75 characters, line-height tuned for font and context, contrast.
- Consistency: same element uses same treatment everywhere, no one-off font-size overrides.
It then fixes what it finds: picks distinctive typefaces, builds a modular scale, widens hierarchy contrast, sets proper line length and leading.
Try it ​
/impeccable typeset the article layoutExpected diff:
- Display font swapped from Inter 700 to a real display face
- Type scale rebuilt: 3rem / 2rem / 1.25rem / 1rem / 0.875rem, ratio 1.333
- Body text bumped from 14px to 16px
- Line length clamped to 68ch on the article column
- Line-height 1.6 for body, 1.1 for display
- Removed four one-off
font-sizevalues scattered in component styles
Pitfalls ​
- Asking for a new font without context. Typeset will pick based on the
PRODUCT.mdbrand voice. If you have not run/impeccable init, the suggestion will be generic. - Reaching for typeset when the issue is layout. If paragraphs are fine but the page feels cramped, you want
/impeccable layout. - Expecting fluid clamp scales on app UIs. Typeset uses fixed rem scales for app interfaces. Fluid typography is for marketing and content pages where line length varies dramatically.