Supplement Warehouse Brand

The Supplement Warehouse Brand Guide meticulously details our designated colors, fonts, and standardized styles, serving as the cornerstone for maintaining uniformity across all our web platforms and ensuring a cohesive brand identity.


Typography

Heading One

Heading Two

Heading Three

Heading Four

Heading Five
Heading Six

Body Text


Brand Colours

Main Brand Colours

Red#e0162b
Blue#00376f
Blue#006edd
Orange#e86e17
White#FFFFFF
General Grey#f8f8f8
Text Grey#a59e9e
Background Grey#e8e8e8
Border Grey#ced0d2
Yellow#F8AE06

Blues

nwh-blue-50#2892FF
nwh-blue-100#1388FF
nwh-blue-200#0074E9
nwh-blue-300#005FC1
nwh-blue-400#004B98
nwh-blue-500#00376F
nwh-blue-600#001B37
nwh-blue-700#000000
nwh-blue-800#000000

Greys

nwh-grey-50#FDFDFD
nwh-grey-100#F4F3F3
nwh-grey-200#E0DDDD
nwh-grey-300#CCC8C8
nwh-grey-400#B9B3B3
nwh-grey-500#A59E9E
nwh-grey-600#8A8181
nwh-grey-700#6D6565
nwh-grey-800#504A4A
nwh-grey-900#332F2F
nwh-grey-950#252222

Box Shadows

0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)Standard
0 1px 2px 0 rgb(0 0 0 / 0.05)Small (sm)
0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)Medium (md)
0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)Large (lg)
0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)Extra Large (xl)
0 25px 50px -12px rgb(0 0 0 / 0.25)Extra Extra Large (2xl)
0 2px 15px #0000001aOriginal shadow
0 .5px .3px #0000000e,0 1.6px 1.1px #00000014,0 7px 5px #00000021Original shadow 2

Border Radius

4pxStandard
2pxSmall
6pxMedium
8pxLarge
12pxExtra Large
16pxExtra Extra Large
24px3x Large
9999pxFull