Skip to main content Skip to navigation
MDS
Guidelines

Icons

Contents

Introduction

Icons are the graphical elements that we use to represent actions or concepts. With them, we aim to communicate ideas at a glance, add interactivity, and draw attention to important information. The Mosaic icons are based on the Icons8 Fluency set. These are designed to be simple, modern, and friendly.

Types

We use outlined and coloured versions of the Fluency set.

Outlined

The outlined icons are used as the main style in Mosaic. These are typically found in the navigation, sidebar, and action buttons. Filled icons are secondary and are occasionally used to show the toggled state of an icon.

HomeFavouritesDesksAppsTasksStore

Coloured

The coloured icons should only be used in the body or content of applications. These provide a splash of colour and also inject a dash of personality.

HomeFavouritesDesksAppsTasksStore

Sizes

Mosaic uses icons at 16px, 24px, 32px, 48px, and 64px.

16px24px32px48px64px

Search