Icons

Material design icons

The NSW Design system uses Material design icons (filled versions) to illustrate actions, status and signage. Icons communicate messages at a glance, suggest interactivity and draw attention to important information.

View & download the icon family from Material design

Icon Style

Sizing

Icons should be designed to an 8 pixel grid and can be scaled and displayed at four sizes depending on use and screen size:

• 8px x 8px
• 16px x 16px
• 24px x 24px
• 32px x 32px

Colour

Icons that are clickable should use NSW Primary Blue to remain consistent with text link styling. If icon is on a background that changes the colour of the text (for example a button) then the icon should take on the same colour as the text.

Icons used to represent a state should use the appropriate colour, for example an icon used in a success notification should use Success Green.

Application

Spacing and positioning

Always allocate the right amount of space around an icon to allow for legibility and touch. Wherever possible, size your spacing in multiples of 4 or 8 pixels.

Support customer expectations

Users grow accustomed to recognising an icon as meaning something. Altering the action behind that icon is extremely confusing.