typography

Automate font pairing selection and type scale planning for web typography.

63|2|Updated Mar 23, 2026

Search Tags:#typography #fonts #type-scale #variable-fonts #opentype #web-fonts

Ready to run

npx skills add https://github.com/stolinski/s-stack --skill typography-stolinski

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: typography
Source: https://github.com/stolinski/s-stack/tree/main/skills/typography
Command: npx skills add https://github.com/stolinski/s-stack --skill typography-stolinski

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Typography decisions can be time-consuming and error-prone, especially when balancing brand voice, readability, accessibility, and performance. This Skill provides structured guidance for font pairing, typographic hierarchy, OpenType features, variable fonts, and web font optimization to ensure consistent, accessible web typography.

Core Features & Use Cases

Font pairing recommendations aligned with brand and readability.
Type scale calculations and responsive typography strategies.
OpenType feature guidance and variable font usage for performance.
Accessibility considerations and contrast guidelines across languages.

Quick Start

Tell me your brand, audience, and platform so I can propose a font pairing, type scale, and OpenType plan.

Frequently Asked Questions about typography

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

FAQPage Schema

How do I choose web fonts that match my brand and stay readable?▼

Choosing web fonts involves structured font pairing recommendations aligned with your brand voice and readability. This Skill proposes font combinations based on your brand identity, audience, and platform while ensuring accessible contrast and typographic hierarchy across your website.

What is a modular type scale and how do I calculate one for my website?▼

A modular type scale uses mathematical ratios to determine proportional font sizes for consistent typographic hierarchy. This Skill automates modular scale calculations and provides responsive typography strategies to ensure text scales proportionally across different viewport sizes.

How do variable fonts improve web typography performance?▼

Variable fonts consolidate multiple weights and styles into a single file, reducing HTTP requests and improving loading performance. This Skill guides variable font implementation and OpenType feature usage to optimize web font delivery without sacrificing typographic flexibility.

Do I need OpenType features for my design system typography?▼

OpenType features provide advanced typographic controls like ligatures and contextual alternates that enhance design system consistency. This Skill provides OpenType feature guidance, helping you determine which capabilities to enable for accessibility and visual polish across different languages.

Can I use this for accessibility-focused typography across multiple languages?▼

Accessibility-focused typography across multiple languages requires proper contrast, readability, and OpenType feature support. This Skill applies accessibility best practices and contrast guidelines to ensure your web typography remains legible and compliant across different languages and platforms.

What's the best way to plan a responsive type scale for a brand identity project?▼

The best way to plan a responsive type scale is applying modular scale calculations that adapt proportionally to different screen sizes. This Skill automates type scale planning for brand identity projects, generating responsive sizing strategies that maintain visual hierarchy across viewports.