·typography
*

typography

petekp/agent-skills

Apply professional typography principles to create readable, hierarchical, and aesthetically refined interfaces. Use when setting type scales, choosing fonts, adjusting spacing, designing text-heavy layouts, implementing dark mode typography, or when asked about readability, font pairing, line height, measure, typographic hierarchy, variable fonts, font loading, or OpenType features.

63Installs·2Trend·@petekp

Installation

$npx skills add https://github.com/petekp/agent-skills --skill typography

SKILL.md

Professional typography for user interfaces, grounded in principles from the masters.

| masters.md | Seeking authoritative backing, making nuanced judgments, understanding "why" | | variable-fonts.md | Using variable fonts, fluid weight, performance optimization | | font-loading.md | FOIT/FOUT issues, preloading, Core Web Vitals, self-hosting | | opentype-features.md | Ligatures, tabular numbers, stylistic sets, slashed zero |

| fluid-typography.md | clamp(), text-wrap, truncation, vertical rhythm, font smoothing | | tailwind-integration.md | Tailwind typography utilities, prose plugin, customization | | internationalization.md | RTL languages, Arabic/Hebrew, CJK, bidirectional text |

Apply professional typography principles to create readable, hierarchical, and aesthetically refined interfaces. Use when setting type scales, choosing fonts, adjusting spacing, designing text-heavy layouts, implementing dark mode typography, or when asked about readability, font pairing, line height, measure, typographic hierarchy, variable fonts, font loading, or OpenType features. Source: petekp/agent-skills.

View raw

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/petekp/agent-skills --skill typography
Category
*Creative Media
Verified
First Seen
2026-02-01
Updated
2026-02-18

Quick answers

What is typography?

Apply professional typography principles to create readable, hierarchical, and aesthetically refined interfaces. Use when setting type scales, choosing fonts, adjusting spacing, designing text-heavy layouts, implementing dark mode typography, or when asked about readability, font pairing, line height, measure, typographic hierarchy, variable fonts, font loading, or OpenType features. Source: petekp/agent-skills.

How do I install typography?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/petekp/agent-skills --skill typography Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor

Where is the source repository?

https://github.com/petekp/agent-skills