skills.rest
47network
47networkCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

typography

Generate modular type scales, font pairings, and readability analyses for interfaces.

5|Updated Apr 15, 2026
Search Tags:#typography#readability#design-system#css-variables#web-design#type-scale#font-pairing
One-click install
npx skills add https://github.com/47network/Sven --skill typography-47network
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: typography
Source: https://github.com/47network/Sven/tree/main/skills/design/typography
Command: npx skills add https://github.com/47network/Sven --skill typography-47network

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Typography system design is time-consuming and error-prone when creating scalable type scales, pairing fonts by mood, and measuring readability. This Skill automates generation of type scales, recommends font pairings by mood, and analyzes readability metrics to accelerate design systems.

Core Features & Use Cases

  • Generate a modular type scale from a base size and ratio.
  • Recommend font pairings based on mood.
  • Analyze readability given font size, line height, and line width.
  • Produce a vertical rhythm baseline system.
  • Export CSS-friendly type scales.

Quick Start

Create a major-third type scale with a 16px base size for a modern dashboard.

Frequently Asked Questions about typography

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a modular type scale for a web design system?▼

Create a vertical rhythm baseline system by defining consistent line heights and spacing units that align text vertically. This Skill automates baseline grid calculations to maintain structural readability across UI components.

Can I get font pairing recommendations based on a specific mood?▼

Get mood-based font pairing recommendations by specifying the desired visual tone for your interface. This Skill analyzes mood parameters to recommend compatible font combinations for dashboards, apps, and docs.

How do I analyze readability metrics for web typography?▼

Analyze readability metrics by inputting font size, line height, and line width to evaluate text legibility. This Skill processes these variables to measure and improve reading comfort across responsive interfaces.

How do I export CSS variables for a responsive type scale?▼

Export CSS variables for a responsive type scale by generating modular sizing rules formatted for web stylesheets. This Skill produces CSS-friendly outputs to implement consistent typography directly in UI/UX workflows.

Related Skills

Explore More Design & Creative Skills→
OlatisunkanmiOlatisunkanmi
8

i-typeset

Assess typography and propose modular type scales with font pairings.

Community
Intermediate
BradliebsBradliebs

frontend-design

Design and implement production-grade frontend interfaces with typography, color systems, and responsive layouts.

Community
Advanced
DanialHaseebDanialHaseeb

typeset

Diagnose and correct typography in UI and content text.

Community
Intermediate
GyananoGyanano
5

typeset

Audits typography and proposes font, scale, weight, and spacing strategies.

Community
Advanced