Provides brand typography selection and hierarchy development frameworks including the Brand-First Typography Selection Process, Modular Scale System, Font Classification Matrix, Serif vs. Sans-Serif Decision Framework, Typeface Evaluation Criteria, Font Pairing Principles, WCAG accessibility requirements, and typography design tokens. Auto-activates during brand typography development, font selection, type hierarchy creation, and typography system work. Use when discussing brand typography, font selection, font pairing, type hierarchy, modular scale, typography accessibility, WCAG typography, or typography guidelines.
View on GitHubplugins/vibes/skills/brand-typography-systems/SKILL.md
January 21, 2026
Select agents to install to:
npx add-skill https://github.com/mike-coulbourn/claude-vibes/blob/main/plugins/vibes/skills/brand-typography-systems/SKILL.md -a claude-code --skill brand-typography-systemsInstallation paths:
.claude/skills/brand-typography-systems/# Brand Typography Systems & Strategic Type Selection Quick reference for developing strategic brand typography systems grounded in personality, hierarchy, and practical application. > "Typography exists to honor content." — Robert Bringhurst, *The Elements of Typographic Style* > "Typography and design should enhance communication, not just look attractive." — Erik Spiekermann > "I can teach anyone good typography in two or three days. The craft is very simple, the rest is just practice." — Erik Spiekermann --- ## Key Principles 1. **Start with personality** — Typography selection flows FROM brand personality TO typeface choices. Never the reverse. 2. **Honor content** — Beautiful type that doesn't serve content fails its purpose. 3. **Contrast through classification** — Serif + sans-serif pairing creates natural hierarchy without conflict. 4. **Form follows function** — Body text prioritizes legibility; display text can prioritize personality. 5. **Consistency builds recognition** — Every touchpoint reinforces (or undermines) brand perception. 6. **Accessibility is non-negotiable** — Design for the widest possible audience. 7. **Systems scale** — Create hierarchies that work across all applications and contexts. --- ## Core Frameworks ### 1. Brand-First Typography Selection Process Typography selection must flow from brand strategy, not aesthetic preference. **The Process:** | Step | Action | Purpose | |------|--------|---------| | 1 | **Define Brand Personality** | Identify 3-5 traits that define brand voice and image | | 2 | **Understand Target Audience** | Demographics, preferences, industry expectations | | 3 | **Gather Inspiration** | Analyze competitors, identify differentiation opportunities | | 4 | **Select and Pair Fonts** | Create mockups across touchpoints (print, web, mobile) | | 5 | **Establish Hierarchy** | Define primary, secondary, tertiary with clear purposes | | 6 | **Create Guidelines** | Document everything with examples and specif