baseline grid

Color

Product colours

Each of our products has it’s own distinctive colour. Using various forms of contrast is the most important consideration when making user-friendly color and interface choices. Awareness of standards and best practices is the key to accessible color selection, the right text colours are shown below for best contrast.

Builder Purple #6200EA
Builder Cloud #304FFE
Builder Green #00C853
Builder Purple A5
Builder Cloud A5
Builder Green A5
Builder Purple A4
Builder Purple A3
Builder Purple A2
Builder Purple A1
Builder Cloud A4
Builder Cloud A3
Builder Cloud A2
Builder Cloud A1
Builder Green A4
Builder Green A3
Builder Green A2
Builder Green A1

Accent and Greys

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Amber
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua della cruz.

Grey
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua della cruz.

Blue Grey
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua della cruz.

Amber A5
Amber A4
Amber A3
Amber A2
Amber A1
Grey 10
Grey 9
Grey 8
Grey 7
Grey 6
Grey 5
Grey 4
Grey 3
Grey 2
Grey 1
Grey 10
Grey 9
Grey 8
Grey 7
Grey 6
Grey 5
Grey 4
Grey 3
Grey 2
Grey 1

Validation

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Notifications

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Red
Notification types
Red A5
Information
Success
Error
Warning