Skip to content

Typography

Heading

  • Heading 1 Font size: 24 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 2 Font size: 22 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 3 Font size: 20 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 4 Font size: 18 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 5 Font size: 16 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

Heading secondary

  • Heading 1 Font size: 24 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 2 Font size: 22 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 3 Font size: 20 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 4 Font size: 18 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Heading 5 Font size: 16 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

Body

  • Body lg Font size: 16 Font family: plus-jakarta-sans Font weight: medium Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body lg bold Font size: 16 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body reg Font size: 14 Font family: plus-jakarta-sans Font weight: medium Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body reg bold Font size: 14 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body sm Font size: 12 Font family: plus-jakarta-sans Font weight: medium Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body sm bold Font size: 12 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body xsm Font size: 10 Font family: plus-jakarta-sans Font weight: medium Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body xsm bold Font size: 10 Font family: plus-jakarta-sans Font weight: semibold Letter spacing: 1%

    The quick brown fox jumps over the lazy dog. 0123456789

Body secondary

  • Body lg Font size: 16 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body lg bold Font size: 16 Font family: neue-haas-grotesk Font weight: medium Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body reg Font size: 14 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body reg bold Font size: 14 Font family: neue-haas-grotesk Font weight: medium Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body sm Font size: 12 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body sm bold Font size: 12 Font family: neue-haas-grotesk Font weight: medium Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body xsm Font size: 10 Font family: neue-haas-grotesk Font weight: regular Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

  • Body xsm bold Font size: 10 Font family: neue-haas-grotesk Font weight: medium Letter spacing: 2%

    The quick brown fox jumps over the lazy dog. 0123456789

Colour

neutral

  • 50 bg-neutral-50 #FFFFFF
  • 100 bg-neutral-100 #F8F8F8
  • 200 bg-neutral-200 #F1F1F1
  • 300 bg-neutral-300 #E4E4E4
  • 400 bg-neutral-400 #D6D6D6
  • 500 bg-neutral-500 #C9C9C9
  • 600 bg-neutral-600 #B0B0B0
  • 700 bg-neutral-700 #919191
  • 800 bg-neutral-800 #767676
  • 900 bg-neutral-900 #555555
  • 950 bg-neutral-950 #333333
  • 1000 bg-neutral-1000 #000000

beige

  • 50 bg-beige-50 #F9F7F3
  • 100 bg-beige-100 #F2EFE7
  • 200 bg-beige-200 #ECE8DC
  • 300 bg-beige-300 #E5E0D0
  • 400 bg-beige-400 #DFD8C4
  • 500 bg-beige-500 #D2C9AF
  • 600 bg-beige-600 #C1B698
  • 700 bg-beige-700 #B1A583
  • 800 bg-beige-800 #A09372
  • 900 bg-beige-900 #8A7F60
  • 950 bg-beige-950 #6A6047
  • 1000 bg-beige-1000 #4A4331

green

  • 50 bg-green-50 #F3FFE9
  • 100 bg-green-100 #E5FFCF
  • 200 bg-green-200 #CEFFA5
  • 300 bg-green-300 #B3F47D
  • 400 bg-green-400 #95E651
  • 500 bg-green-500 #7DD236
  • 600 bg-green-600 #6DC029
  • 700 bg-green-700 #5AA31D
  • 800 bg-green-800 #468512
  • 900 bg-green-900 #336D03
  • 950 bg-green-950 #2B5F00
  • 1000 bg-green-1000 #245000

pink

  • 50 bg-pink-50 #FDF4F9
  • 100 bg-pink-100 #FFE8F7
  • 200 bg-pink-200 #FFD6F0
  • 300 bg-pink-300 #FFC5EA
  • 400 bg-pink-400 #FFA7DC
  • 500 bg-pink-500 #FF7CC0
  • 600 bg-pink-600 #FF48A7
  • 700 bg-pink-700 #F51689
  • 800 bg-pink-800 #DE0073
  • 900 bg-pink-900 #B1005C
  • 950 bg-pink-950 #840045
  • 1000 bg-pink-1000 #620033

red

  • 50 bg-red-50 #FFF0F0
  • 100 bg-red-100 #FFD9DA
  • 200 bg-red-200 #FFBEC0
  • 300 bg-red-300 #FF9C9F
  • 400 bg-red-400 #FF767B
  • 500 bg-red-500 #FF454C
  • 600 bg-red-600 #ED1C24
  • 700 bg-red-700 #DD0419
  • 800 bg-red-800 #C50010
  • 900 bg-red-900 #A60006
  • 950 bg-red-950 #7D0005
  • 1000 bg-red-1000 #560101

yellow

  • 50 bg-yellow-50 #FFF9E6
  • 100 bg-yellow-100 #FFF2CA
  • 200 bg-yellow-200 #FFE7A6
  • 300 bg-yellow-300 #FFDA7D
  • 400 bg-yellow-400 #FFCC49
  • 500 bg-yellow-500 #FFBB27
  • 600 bg-yellow-600 #FFAA00
  • 700 bg-yellow-700 #F28D00
  • 800 bg-yellow-800 #DB7100
  • 900 bg-yellow-900 #B55800
  • 950 bg-yellow-950 #8D4500
  • 1000 bg-yellow-1000 #683300

Buttons

Badges

Light badge
Dark badge

Icons

menu

atc

basket

basket-amount

3
3
3

accounts

search

wishlist

save

flag

support

arrow-left

arrow-right

tick

chevron-down

chevron-up

plus

minus

close

Swatches

Colour

Colour OOS

White

White OOS

Color

Add to bag