Design Tokens for Mesh have just been released!
Skip to content

Design

Designing digital products and services that utilise nib's design system Mesh can help to make your work easier, allowing you to create less new work by following established design patterns and leveraging our design tooling like Figma component libraries and Playroom for designing with React web components.

Design principles

Our design principles inform how we design at nib.

These principles underlie and inform the way we 'do design' at nib. They encourage us to continue striving to produce elegant products and solutions that best balance the needs of our end users with our business goals. We strive to pursue these in all design work we undertake, and encourage anyone working on design to do the same.

Design tools

Figma

Figma app icon

Our Figma libraries include components for web and mobile design along with foundational styles like typography and color.

Helpful articles about Figma libraries and components:

Playroom

Playroom logo

Playroom allows you to simultaneously design using the Mesh react components across a variety of themes and screen sizes.

Open playroom

Storybook

Storybook logo

Storybook is a sandbox where you can explore Mesh design system components.

Open Storybook