mcpField
T
type-systems

type-systems

github.com/dragoon0xDesign & UI681 installsUpdated 35w ago
Repository

About type-systems

type-systems is a design skill for structuring typography, intended for designers who need consistent text hierarchy. It uses mathematical ratios for type scales and sets constraints for weights, line heights, and tracking.

Key features

  1. 01Builds type scales with mathematical ratios
  2. 02Limits each screen to four to six sizes
  3. 03Assigns a purpose to each weight
  4. 04Sets line heights by text type
  5. 05Guides tracking and line length

Use cases

  1. 01Create a consistent type scale for an interface
  2. 02Control text hierarchy and weight count on a screen
  3. 03Set line heights for body text, headlines, and labels

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/dragoon0x/taste-skills --skill type-systems

After installing, type/type-systemsin Claude Code to confirm it loaded.

Details

From the project README

Type Systems

Typography is a system. Every decision should be intentional and connected.

How to use

  • /type-systems Apply type system constraints to this conversation.

Constraints

Scale
  • MUST use a mathematical ratio for the type scale (1.25, 1.333, 1.5 between sizes)
  • Wide range (12px to 72px): dramatic hierarchy, suits editorial and marketing
  • Narrow range (14px to 24px): subtle hierarchy, suits dense products
  • NEVER use random sizes. If it's not on the scale, it shouldn't exist.
  • MUST limit to 4-6 sizes per screen maximum with clear justification for each
Weight
  • 1-2 weights: discipline. Hierarchy comes from scale and space, not weight.
  • 3 weights: normal range. Regular body, medium emphasis, bold headlines.
  • 4+ weights: either the system demands it or you haven't made a decision.
  • MUST ensure each weight serves a distinct, named purpose
Line Height
  • Body text: 1.5-1.7x font size. Where readability lives.
  • Headlines: 1.1-1.3x. Large text has built-in breathing room.
  • UI labels: 1.2-1.4x. Compact but not crushed.
  • NEVER use the same line height for all text sizes
Letter Spacing
  • Body text: leave it alone. The type designer already optimized it.
  • All-caps labels: add 2-5% tracking. Capitals need air.
  • Large display text (72px+): sometimes benefits from tightening.
Anti-Patterns
  • More than 3 type sizes on a single screen without clear hierarchy justification
  • Centering paragraphs longer than 3 lines
  • Lines over 75 characters wide (hurts readability)
  • Inconsistent weight usage with no system behind it

Comments

Markdown supported