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.
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.
Try these with the skill installed
Select a font pairing for my SaaS marketing site using web-typography skill
Brand typographySet up a responsive typographic scale using CSS clamp() using web-typography skill
ImplementationImprove the readability of my blog post template using web-typography skill
Content designAudit my site's typography for consistency and hierarchy using web-typography skill
Design reviewInstall 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