What kind of output does it provide?

It generates HTML artifacts containing type specimens, hierarchy scales, and paragraph samples for iterative, side-by-side review.

Does it support accessibility standards?

Yes, it evaluates typography against accessibility criteria such as minimum font sizes, contrast ratios, and optimal line lengths (45-75 characters).

What is the crit-typography skill?

It is a specialized plugin for Claude Code that performs structured critiques of typographic systems, helping you select fonts and establish visual hierarchy.

Can I use it with my existing design state?

Yes, it integrates with the design-crit state management system to ensure typography complements your locked layout and component decisions.

How does it decide on font pairings?

The skill analyzes your project brief, brand tone, and technical constraints to recommend fonts that align with your product's personality and platform requirements.

Typography Design Critique

Name: Typography Design Critique
Author: metedata

bymetedata

0•

设计工具

Evaluates and generates professional typographic systems, including font selection, type scales, and hierarchy for UI designs.

The crit-typography skill provides structured, expert-level feedback on the typographic choices of a design project within Claude Code. It generates detailed HTML wireframe artifacts that showcase type specimens, realistic paragraph samples, and hierarchical scales tailored to the project's brand tone and technical constraints. By analyzing font pairing, readability metrics, and scale ratios, it helps developers and designers establish a consistent, legible, and visually balanced text system that integrates seamlessly with existing layout and component designs.

主要功能

01Tests body text readability with character-per-line and line-height analysis

02Calculates and evaluates scale ratios for optimal visual rhythm

03Generates interactive HTML type specimens and hierarchy scales

04Analyzes typographic economy to ensure a manageable number of weights

05Provides font pairing recommendations based on brand alignment

060 GitHub stars

使用场景

01Establishing a new design system's type scale and font stack

02Iterating on font pairings to match a specific brand personality

03Auditing existing UI typography for readability and accessibility issues

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add metedata/design-crit crit-typography

For use in Claude.ai and ChatGPT

Download Skill