apply-typography-scale

Community

Generate clear UI typography hierarchy fast

Authorgnurio
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It prevents confusing or inconsistent UI typography by turning scattered font choices into a deliberate hierarchy of sizes, weights, and line-heights.

Core Features & Use Cases

  • Hand-crafted type scale: Uses intentional, readable jumps between sizes rather than “mathematical” scaling.
  • UI-safe sizing rules: Enforces px/rem usage (no em compounding), minimum UI readability (no weights below 400), and only two UI weights (400/500 and 600/700).
  • Context-aware recommendations: Produces different scale targets for marketing, application, and content contexts.
  • Readability constraints: Guides line-height proportion and typical line-length ranges to reduce cramped or overly wide text.

Quick Start

Apply the typography scale to your design description for a marketing context using base size 16.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: apply-typography-scale
Download link: https://github.com/gnurio/refactoring-ui-plugin/archive/main.zip#apply-typography-scale

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.