Who it’s for
Any NSW Government department can use the NSW Design System. It provides ready-made components so teams can work consistently.
How to use it
Browse core styles and components. Read usage guidance and access UI kits in Figma, HTML and React.
🔹 Required for brand compliance
Features marked with a 🔹 (blue diamond) must be used to meet NSW Government brand rules.
Get started
Explore the system structure. Set up your brand theme and access the Figma UI kit.
Install the starter kits. Apply your brand theme and use the utility classes.
Core styles (colour, type and layout)
Use these styles to apply the NSW Government look and feel.
UI components and patterns
Reusable components for common user tasks.
- Accordion
- Back to top
- Breadcrumbs
- Buttons🔹
- Callout
- Card carousel
- Cards
- Close button
- Content blocks
- Cookie consent
- Date input
- Date picker
- Dialog
- File upload
- Filters
- Footer🔹
- Forms🔹
- Global alert
- Header🔹
- Hero banner
- Hero search
- In-page alert
- In-page navigation
- Link
- Link list
- List items
- Loader
- Main navigation
- Masthead🔹
- Media
- Pagination
- Popover
- Progress Indicator
- Quick exit
- Results bar
- Select
- Side navigation
- Status labels
- Steps
- Support list
- Tables
- Tabs
- Tags
- Tooltip
- Utility list
Design patterns
Solutions for user-focused tasks and visual content.
Report a problem
Report bugs through Github or the Digital NSW community.
Join the community
Join the Digital NSW Community to share ideas and collaborate. You can also visit the GitHub repository.
Get updates
Stay up to date by subscribing to the NSW Design System mailing list.