Australian Government Design System

# Australian Government Design System — Design Style Reference

> **Unofficial, community-authored reference.** Compiled by [designsystems.one](https://www.designsystems.one). Not affiliated with, endorsed by, or sponsored by Australian Government. "Australian Government Design System" and related marks belong to their respective owners. This document describes publicly observable style attributes in original words — it contains no copied documentation, logos, icon artwork, or original token files. Always defer to the official source for canonical, current values.

**System:** Australian Government Design System
**Owner:** Australian Government
**Official documentation:** https://gold.designsystemau.org/
**Visual character:** Plain-English government service styling — a working teal-blue, system fonts, and WCAG-first restraint, now community-stewarded as GOLD.

---

## Summary

Design system for Australian Government websites and digital services.

_Confidence: medium. Most values are publicly documented; a few are best-effort readings of the live product. The federal AGDS was decommissioned in 2021; GOLD continues it as a community project._

## Color tokens

| Color | Value | CSS variable | Role |
| --- | --- | --- | --- |
| Primary Blue | `#00698f` | `--agds-foreground-action` | Links and primary actions |
| Text | `#313131` | `--agds-foreground-text` | Primary text |
| Muted Text | `#4f4f4f` | `--agds-foreground-muted` | Secondary text |
| Page Background | `#ffffff` | `--agds-background-page` | Page background |
| Shade Background | `#f5f5f5` | `--agds-background-shade` | Alternate sections |
| Error Red | `#d60000` | `--agds-error` | Errors |
| Success Green | `#0b996c` | `--agds-success` | Success |
| Border | `#808080` | `--agds-border` | Borders |

## Typography

- **Body:** System stack — weights 400, 700 — `-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif`

## Type scale

| Step | Size | Line height |
| --- | --- | --- |
| xxxl | `48px` | `51px` |
| xxl | `32px` | `41px` |
| xl | `24px` | `31px` |
| md (body) | `16px` | `24px` |

## Spacing

Base unit: `8px (unit)`

Scale: `8px` · `16px` · `24px` · `32px` · `40px` · `48px`

## Corner radius

| Name | Value |
| --- | --- |
| default | `4px` |

## Quick start (CSS)

```css
/* Australian Government Design System — illustrative tokens, restated as CSS custom properties.
   Unofficial reference by designsystems.one; values are indicative, not
   canonical. Official reference: https://gold.designsystemau.org/ */

:root {
  /* Color */
  --agds-foreground-action: #00698f; /* Links and primary actions */
  --agds-foreground-text: #313131; /* Primary text */
  --agds-foreground-muted: #4f4f4f; /* Secondary text */
  --agds-background-page: #ffffff; /* Page background */
  --agds-background-shade: #f5f5f5; /* Alternate sections */
  --agds-error: #d60000; /* Errors */
  --agds-success: #0b996c; /* Success */
  --agds-border: #808080; /* Borders */

  /* Typography */
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;

  /* Type scale */
  --text-xxxl: 48px /* line-height 51px */;
  --text-xxl: 32px /* line-height 41px */;
  --text-xl: 24px /* line-height 31px */;
  --text-md-body-: 16px /* line-height 24px */;

  /* Spacing */
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 40px;
  --space-6: 48px;

  /* Radius */
  --radius-default: 4px;
}
```

## Engineering profile

- **Ships for:** CSS-only, Framework-agnostic
- **Token pipeline:** Custom
- **Source model:** Open source

## Apply this style with an AI tool

Paste this into your AI coding assistant as a direction, then iterate:

> Design in the spirit of Australian Government Design System by Australian Government — Design system for Australian Government websites and digital services. Character: Plain-English government service styling — a working teal-blue, system fonts, and WCAG-first restraint, now community-stewarded as GOLD. Use a primary colour near #00698f, the typeface "System stack" (or a close equivalent), corner radius around 4px, a spacing rhythm on a 8px (unit) base. Match the intent, not the pixels; adapt it to my product rather than cloning it.

## Official reference

- [Australian Government Design System documentation](https://gold.designsystemau.org/)

---

_Generated by [designsystems.one](https://www.designsystems.one/design-systems/australia-design) — a catalogue of public design systems. Style facts are reported for reference and education; adapt them to your own product. Report issues or takedown requests via the site._