typography
Typography Skill
This skill covers CSS typography patterns for creating readable, aesthetically pleasing text. It addresses type scale, hierarchy, vertical rhythm, font pairing, and modern CSS text features.
Philosophy
Good typography:
- Establishes hierarchy - Readers scan before reading; size, weight, and spacing guide them
- Maintains rhythm - Consistent spacing creates visual harmony
- Optimizes readability - Line length, spacing, and contrast serve comprehension
- Respects the medium - Web typography adapts to screens and user preferences
Type Scale
A type scale provides consistent, harmonious font sizes based on a mathematical ratio.
Recommended Scale (Major Third - 1.25)
More from profpowell/project-template
css-author
Modern CSS organization with native @import, @layer cascade control, CSS nesting, design tokens, and element-focused selectors. AUTO-INVOKED when editing .css files.
3typescript-author
Write TypeScript for Web Components and Node.js with strict typing. Use when adding types to JavaScript projects, building type-safe APIs, or creating generic utilities.
3javascript-author
Write vanilla JavaScript for Web Components with functional core, imperative shell. Use when creating JavaScript files, building interactive components, or writing any client-side code.
3metadata
HTML metadata and head content. Use when writing or reviewing page head sections including SEO, social sharing, performance hints, and bot control.
1data-storage
Implement client-side data storage with localStorage, IndexedDB, or SQLite WASM. Use when storing user preferences, caching data, or building offline-first applications.
1