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

Unifying Government through Design and Code.

Get started
JSsgds.js
<h3>Write once. Ship anywhere.</h3>
<p class="sgds:text-subtitle-sm sgds:font-light">
 SGDS Design tokens → Tailwind v4
</p>
<sgds-combo-box label="Drop into any stack"
    value="react;vue;angular;svelte;vanilla" multiSelect>
</sgds-combo-box>|

Design once,
use everywhere.

Placeholder 1Placeholder 2Placeholder 3Placeholder 4

Building together,
designing better.

Shared foundation,
stronger services.

With a common foundation of colour, typography, and components, our design system helps teams create consistent, accessible, and reliable services across government.

Placeholder 7
100px100px1400px1600px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px

Empowering teams,
transforming services.

Design tokens

Design tokens

Colour

Colour

Iconography

Iconography

Singapore Government Design System

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

Past VersionsSGDS v1SGDS v2