This site is a work in progress as part of GovTech {build} hackathon. Content may be incomplete or subject to change.

Overline

Overline styles are predefined combinations of typography variables for compact labels and categorisation, keeping them consistent across interfaces.

When to use overline

Overline styles are used for short categorical labels and compact pre-heading text. They help introduce a section or content type without taking on the weight of a full heading.

Style name

Preview

When to use

SGDS tailwind token

OVERLINE SEMIBOLD

Short category labels above headings when the label needs emphasis.

sgds:text-overline-mdsgds:font-semiboldsgds:leading-2-xssgds:tracking-wide

OVERLINE REGULAR

Default

OVERLINE REGULAR

Default overline style for compact category and section labels.

sgds:text-overline-mdsgds:font-regularsgds:leading-2-xssgds:tracking-wide

Singapore Government Design System

The Singapore Government Design System was developed to empower teams in creating fast, accessible and mobile-friendly digital services.