Define font scales, weights, and line heights for web interfaces.
npx skills add https://github.com/Dzakiamriz22/frontend-pack --skill typography-dzakiamriz22
Please help me install this Agent Skill. Skill: typography Source: https://github.com/Dzakiamriz22/frontend-pack/tree/main/skills/typography Command: npx skills add https://github.com/Dzakiamriz22/frontend-pack --skill typography-dzakiamriz22
This skill eliminates inconsistent, unreadable, or visually unappealing text in web applications by enforcing a strict, industry-standard typography scale and rhythm.
Use the typography skill to generate a responsive type scale configuration for a new landing page.
High-intent search queries and answers about installing and using this skill.
To create a consistent UI typography scale, you apply a modular ratio like 1.25 to define harmonious font sizing across all interface elements. This ensures visual hierarchy and readability for headings, body text, and labels.
Your web interface text may fail WCAG 2.1 accessibility standards due to inconsistent line heights and letter spacing. Applying semantic styling rules based on component context ensures text meets readability requirements.
The best way to enforce vertical rhythm in modern web applications is standardizing font weights and line heights using a modular type scale. This approach eliminates visually unappealing text and maintains spacing consistency.
You can use standard design system typography patterns for dashboards and landing pages by generating a responsive type scale configuration. This ensures semantic styling and perfect vertical rhythm across all UI components.
Applying a typography system does not require specific CSS frameworks to function. It defines semantic styling rules for font scales and line heights that integrate directly into any modern web interface design.
You set CSS font weights and line heights for UI components by applying semantic styling rules based on context. This standardizes headings, body text, and labels to ensure high readability across the interface.
spuneiarturApply Anthropic brand colors, typography, and CSS variables to design artifacts.
Markson22Extract design tokens and documentation from CSS, theme files, and screenshots.
jiaiyanDefine typography conventions and CSS variables for Element Plus components.
htafollaDesign mobile-first user interfaces with WCAG 2.1 AA accessibility compliance.
