What problem does it solve?
Generic, inconsistent, or poorly structured typography that makes text feel accidental, hard to read, and out of sync with brand personality — this Skill converts default-looking type into intentional, polished typography that improves readability and communication.
Core Features & Use Cases
- Font selection & pairing: Replace invisible defaults with fonts that match brand voice, limit families to 2–3, and ensure metric-matched fallbacks and efficient loading strategies.
- Hierarchy & type scale: Establish a modular scale, clear size and weight roles for headings, body, captions, and propose rem- or clamp()-based rules per context.
- Readability & accessibility: Recommend line-length (ch), line-height, letter-spacing, minimum body size (16px), and WCAG contrast checks to ensure legibility across devices.
- Weight consistency & performance: Define weight roles, limit loaded weights, and advise semantic token naming for maintainable CSS variables.
- Use Case: Improve a portfolio or marketing site by defining a 5-step type scale, selecting brand-appropriate fonts, and producing CSS token suggestions to replace default system fonts.
Quick Start
Improve the homepage typography by auditing current fonts and sizes, choosing a 1.25 modular scale, and returning recommended font-family, size, weight, line-height, and CSS token names.
