Cookies on

Cookies are small files stored on your device when you visit a website. We use some essential cookies to make this website work.

We would like to set additional cookies to remember your settings and understand how you use the site. This helps us to improve our services.

You have accepted all additional cookies. You have rejected all additional cookies. You can change your cookie preferences at any time.

Skip to main content

Prototyping Figma UI library


To create wireframe prototypes with the ONS Design System components and styles, you can use our Figma UI library

The Design System UI library contains:

  • colours
  • typography styles
  • logos
  • icons
  • components

For help and information on using libraries, read the guide to libraries on the Figma website (opens in a new tab) 

Important information:

If you have any issues or need help accessing our Figma library, email the design system team at (opens in a new tab) 

Low-fidelity library

If you want to quickly create a simple prototype to test core functionality and user flows in minimal detail, use ONS Design System low-fidelity Figma UI library (opens in a new tab) .

High-fidelity library

If you need to do more detailed research to analyse how users interact with a final design, use the ONS Design System high-fidelity Figma UI library (opens in a new tab) .

Help improve this page

Let us know how we could improve this page, or share your user research findings. Discuss this page on GitHub (opens in a new tab)