Skills
.Work. You
Rest

sgds-typography

Official

Enforce SGDS typography for consistent UI text.

Design & Creative#typography#design-system#font-size#font-weight#line-height#sgds#letter-spacing
AuthorGovTechSG
Version1.0.0
Installs0

System Documentation

What problem does it solve?

SGDS typography usage is often inconsistent across projects. This skill guides AI agents to apply font sizes, weights, line heights, and letter spacing consistently using sgds: prefixes.

Core Features & Use Cases

  • Guided application of sgds typography utilities for font-size, font-weight, line-height, and letter-spacing.
  • Consistent styling across components and documentation by standardizing prefix usage and class names.
  • Use Case: When a designer specifies a 16px body text or 28px heading, the AI can translate that into the correct sgds: classes for implementation.

Quick Start

Configure a UI component to use SGDS typography by applying sgds:text-16 for body text.

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: sgds-typography
Download link: https://github.com/GovTechSG/sgds-web-component/archive/main.zip#sgds-typography

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 510,000+ vetted skills library on demand.