Design & UX

Web Typography

Web typography principles and implementation

Master web typography from typeface selection to responsive implementation. Based on Jason Santa Maria's "On Web Typography," this skill helps your AI agent make informed typographic decisions that improve readability and brand expression.

On Web Typography by Jason Santa Maria

On Web Typography

by Jason Santa Maria

npx skills add wondelai/skills/web-typography

What your agent learns

Typeface Selection

Evaluate typefaces based on their personality, legibility at various sizes, and glyph coverage.

Typographic Scale

Build a modular scale that creates harmonious relationships between heading and body sizes.

Measure & Line Height

Set optimal line length (45-75 characters) and line height for comfortable reading.

Font Pairing

Combine typefaces that complement each other through contrast in style, weight, or structure.

Responsive Typography

Use fluid type sizing and viewport-aware adjustments for readability across devices.

Jason Santa Maria

Award-winning designer, former creative director of A List Apart

Jason Santa Maria is an award-winning graphic designer and creative director who shaped web typography at Typekit (now Adobe Fonts). He served as creative director of A List Apart and co-founded Typedia.

View Book →

Try these with the skill installed

Select a font pairing for my SaaS marketing site using web-typography skill

Brand typography

Set up a responsive typographic scale using CSS clamp() using web-typography skill

Implementation

Improve the readability of my blog post template using web-typography skill

Content design

Audit my site's typography for consistency and hierarchy using web-typography skill

Design review

Install Web Typography

Free, open-source, and ready in 30 seconds.

npx skills add wondelai/skills/web-typography

MIT Licensed · Works with Claude Code, Cursor, Claude Cowork & OpenClaw · No account needed