Colours
The colour palette is essentially the backbone of the design language. It is linked to and is a pre-requisite for almost all other foundational elements and components. At the root-level there are three distinct colour palettes: brand colors, base colours and monotones – each serving a specific purpose.
Brand Colours
Oolio#673AB6
Dark#5E35B1
Light#F9F8FC
Gradient
135º
#673AB6
#3023AE
Bepoz#002D6A
Dark#002455
Light#E7EBF3
Gradient
135º
#002D6A
#303F9F
Deliverit#1E87E4
Dark#1976D2
Light#F7FBFD
Gradient
135º
#1E87E4
#03A9F4
Golfbox#00A8D5
Dark#008BB1
Light#E3F5FA
Gradient
135º
#439F46
#8BC34A
Idealpos#00897B
Dark#00796B
Light#F6FBFA
Gradient
135º
#00897B
#43A047
Ordermate#E53935
Dark#D32F2F
Light#FFF9FA
Gradient
135º
#E53935
#C62828
SwiftPOS#FB8C00
Dark#F57C00
Light#FFFBF6
Gradient
135º
#FB8C00
#FF5722
Colour Palette
Red#f44336
Pantone 1788 C
Dark#e53935
Pantone 179 C
Light#ffebee
Pantone 705 C
Lightest#fff9fa
Pink#e91e63
Pantone 213 C
Dark#d81b60
Pantone 226 C
Light#fce4ec
Pantone 7436 C
Lightest#fdf7f9
Purple#9c27b0
Pantone 253 C
Dark#8e24aa
Pantone 526 C
Light#f4e4f5
Pantone 670 C
Lightest#fbf7fb
Deep Purple#673ab6
Pantone 266 C
Dark#5e35b1
Pantone 268 C
Light#ede7f6
Pantone 7436 C
Lightest#f9f8fc
Indigo#4050b5
Pantone 7455 C
Dark#3949ab
Pantone 7672 C
Light#e7eaf6
Pantone 7443 C
Lightest#f8f9fc
Blue#2196f3
Pantone 2925 C
Dark#1e87e4
Pantone 2727 C
Light#e3f2fd
Pantone 656 C
Lightest#f7fbfd
Light Blue#03a9f4
Pantone 2995 C
Dark#049be5
Pantone 2925 C
Light#e1f5fe
Pantone 656 C
Lightest#f6fbfe
Cyan#00bcd4
Pantone 311 C
Dark#05acc1
Pantone 7710 C
Light#e0f7fa
Pantone 649 C
Lightest#f6fcfd
Teal#009688
Pantone 327 C
Dark#00897b
Pantone 7714 C
Light#e0f2f1
Pantone 7457 C
Lightest#f6fbfa
Green#4caf50
Pantone 7738 C
Dark#439f46
Pantone 7740 C
Light#e7f5e9
Pantone 621 C
Lightest#f8fbf8
Light Green#8bc24b
Pantone 360 C
Dark#7bb241
Pantone 576 C
Light#f1f8e9
Pantone 7541 C
Lightest#fafcf8
Lime#cddc39
Pantone 380 C
Dark#bec833
Pantone 7765 C
Light#f8fbe7
Pantone N/A
Lightest#fcfdf8
Yellow#ffeb3b
Pantone 107 C
Dark#fdd836
Pantone 123 C
Light#fffde7
Pantone 7499 C
Lightest#fffdf8
Amber#ffc008
Pantone 7549 C
Dark#ffb300
Pantone 137 C
Light#fff8e1
Pantone 7401 C
Lightest#fffcf6
Orange#ff9800
Pantone 1375 C
Dark#fb8c00
Pantone 716 C
Light#fff3e0
Pantone 7506 C
Lightest#fffbf6
Deep Orange#ff5722
Pantone 172 C
Dark#f2501e
Pantone 166 C
Light#fae8e5
Pantone 474 C
Lightest#fcf7f7
Colour Palette (Dark Mode)
Red Light#57211d
Red Lightest#3f1b19
Pink Light#461526
Pink Lightest#30131D
Purple Light#331738
Purple Lightest#251528
Deep Purple Light#2c1f44
Deep Purple Lightest#231a32
Indigo Light#1D2139
Indigo Lightest#181A29
Blue Light#16344c
Blue Lightest#142736
Light Blue Light#0F3648
Light Blue Lightest#102732
Cyan Light#0E3B41
Cyan Lightest#102A2D
Teal Light#0E322E
Teal Lightest#0F2422
Green Light#203821
Green Lightest#1a281a
Light Green Light#303D20
Light Green Lightest#232B1A
Lime Light#40431C
Lime Lightest#2C2E17
Yellow Light#4B461C
Yellow Lightest#333017
Amber Light#4B3C10
Amber Lightest#332A10
Orange Light#54370d
Orange Lightest#3d2a0f
Deep Orange Light#4B2316
Deep Orange Lightest#331C14
Monotones
White#ffffff
Grey 1#fafafa
Grey 2#f2f2f2
Grey 3#e5e5e5
Grey 4#cccccc
Grey 5#a6a6a6
Grey 6#808080
Grey 7#4f4f4f
Black#000000
Black 1#222222
Black 2#333333
Interface 1#121212
Interface 2#1e1e1e
Data Visualisations (Light & Dark)
Series 1#2196f3
Series 2#FFC008
Series 3#E91E63
Series 4#4CAF50
Series 5#00BCD4
Series 6#673AB6
Series 7#FF5722
Series 8#CDDC39
Series 9#009688
Series 10#9C27B0
Series 11#FB8C00
Series 1#16344C
Series 2#4B3C10
Series 3#461526
Series 4#203821
Series 5#0E3B41
Series 6#2C1F44
Series 7#4B2316
Series 8#40431C
Series 9#0E322E
Series 10#331738
Series 11#54370D