Typography

Headings

Heading Display

Heading XLarge

Heading Large

Heading Medium

Heading Small

Heading XSmall
Heading 2XSmall

Sale headings

Sale Large

Sale Medium

Sale Small

Body

Body XLarge

Body XLarge Bold

Body Large

Body Large Bold

Body Medium

Body Medium Bold

Body Small

Body Small Bold

Body XSmall

Body XSmall Bold

Eyebrows

Eyebrow Small

Eyebrow Small Bold

Eyebrow XSmall

Eyebrow XSmall Bold

Eyebrow 2XSmall

Eyebrow 2XSmall Bold

Colours

Brand colors

brand 01 #323537 rgb(50, 53, 55)
brand 02 #766D60 rgb(118, 109, 96)
brand 03 #F3EEEA rgb(243, 238, 234)
brand 04 #B9B1AB rgb(185, 177, 171)
brand 05 #636665 rgb(99, 102, 101)
brand 06 #EDE6E5 rgb(237, 230, 229)
brand 07 #ECE8EB rgb(236, 232, 235)
brand 08 #DEDFE1 rgb(222, 223, 225)
brand 09 #EBECEA rgb(235, 236, 234)
brand 10 #E7E1DD rgb(231, 225, 221)
brand 11 #FCFAF9 rgb(252, 250, 249)

Brand Highlight Colours

brand 12 #A25567 rgb(162, 85, 103)
brand 13 #295059 rgb(41, 80, 89)
brand 14 #DE1E33 rgb(222, 30, 51)
brand 15 #766D60 rgb(118, 109, 96)

Neutral colours

neutral 00 #FFFFFF rgb(255, 255, 255)
neutral 05 #FAFAFA rgb(250, 250, 250)
neutral 10 #F1EFEE rgb(241, 239, 238)
neutral 20 #E4E3E3 rgb(228, 227, 227)
neutral 30 #D5D5D5 rgb(213, 213, 213)
neutral 40 #8E8B8B rgb(142, 139, 139)
neutral 50 #636665 rgb(99, 102, 101)
neutral 60 #606060 rgb(96, 96, 96)
neutral 70 #4D4D4D rgb(77, 77, 77)
neutral 80 #272727CC rgba(39, 39, 39, 0.8)
neutral 90 #272727E5 rgba(39, 39, 39, 0.9)
neutral 100 #323537 rgb(50, 53, 55)

System

error-light #AF2A1A rgb(175, 42, 26)
error-dark #E34935 rgb(227, 73, 53)
success-light #1D6E4F rgb(29, 110, 79)
success-dark #C9F0C7 rgb(201, 240, 199)
sale #DE1E33 rgb(222, 30, 51)

Text tokens

text-primary
brand-01
text-secondary
neutral-60
text-brand
brand-01
text-invert
neutral-00

Surface tokens

surface-primary
neutral-00
surface-secondary
brand-03
surface-brand
neutral-05
surface-invert
brand-01

Border tokens

border-primary
neutral-80
border-secondary
brand-10
border-invert
brand-10

Spacing

Space

spacing-none
0px
spacing-4xs
4px (0.25rem)
spacing-3xs
8px (0.5rem)
spacing-2xs
12px (0.75rem)
spacing-xs
16px (1rem)
spacing-sm
20px (1.25rem)
spacing-md
24px (1.5rem)
spacing-lg
32px (2rem)
spacing-xl
48px (3rem)
spacing-2xl
56px (3.5rem)
spacing-3xl
64px (4rem)
spacing-4xl
96px (6rem)

Borders

Border Colors

border-primary
neutral-80
border-secondary
brand-10
border-invert
brand-10

Border Radius

radius-none
0px
radius-sm
4px (0.25rem)
radius-md
8px (0.5rem)
radius-lg
16px (1rem)
radius-xl
32px (2rem)
radius-2xl
128px (8rem)
radius-full
360px (22.5rem)

Border Width

border-sm
1px (0.0625rem)

Logos

Primary Logo

Buttons

Primary Button

Primary Button (Light)

Primary Button with Icon

Primary Button (Light) with Icon

Secondary Button

Secondary Button (Light)

Secondary Button with Icon

Secondary Button (Light) with Icon

Underline Button

Underline Button (Light)

Underline Button with Icon

Underline Button (Light) with Icon

Icons

General Icons

Search
Account
Cart
Burger menu
Filter
Wishlist
Wishlist fill
Edit
Settings
Info
Lowstock
Returns
Bin
Tag
Calendar
Tick
Orders
Address book
Log out
Overview
Pause
Play
Sound
Mute
Gb
Delivery
Expand
Image
Location
Phone
View 360
Collections
Stars
Star
Lock
Finance
Video camera

Navigation Icons

Chevron left
Chevron right
Chevron up
Chevron down
Arrow left
Arrow right
Arrow up
Arrow down
Zoom in
Zoom out
Plus
Minus
Close
Chevron fill left
Chevron fill right
Chevron fill up
Chevron fill down

Social Icons

Facebook
Linkedin
Tiktok
Twitter
Instagram
Pinterest
Whatsapp
Snapchat
Youtube