Skip to content
Mesh

Iconography

Our icon library presents pixel-perfect, scalable SVG-based icons that are light, simple, and clearly recognisable, while being distinctive and complementary to the nib brand. Our icon library includes system and graphic icon assets.

Download

You can download all of our icons as a single zip file in SVG or PNG format below.

If you require an icon that isn’t available, please fill out the request an icon email form.

System and graphic icons

The nib design system uses two types of icons; System icons and Graphic icons.

System icons are functional pictograms that represent a task or content a user may expect to view. You would typically see a system icon when interacting with an nib digital product like online services or our app.

Graphic icons add visual expression to accompanying content and are non-functional. Two variations of graphic icons are provided; in a single colour or with an accent colour.

System icons

16px

24px

32px

View system icon library

Graphic icons

Single color

48px

64px

96px

128px

With accent color

48px

64px

96px

128px

View graphic icon library

Color

Core icon colors.

William

colors.william

#008a20

Tick In Circle Large AA Contrast

Tick In Circle Normal AA Contrast

Cross In Circle AAA Contrast

Snow (White)

colors.white

#ffffff

Tick In Circle Large AA Contrast

Tick In Circle Normal AA Contrast

Tick In Circle AAA Contrast

Doc

colors.doc

#444444

Tick In Circle Large AA Contrast

Tick In Circle Normal AA Contrast

Tick In Circle AAA Contrast

Special icon colors.

Julia

colors.julia

#E74C3C

Tick In Circle Large AA Contrast

Cross In Circle Normal AA Contrast

Cross In Circle AAA Contrast

To be used to highlight an error state.

Incorrect email

Alignment

Icons should always be vertically aligned to the middle of text baseline.

Want to contribute to our icon library?

For further information and instructions see our icon contribution guidelines. Sorry, nib employees only.