01 — Typography + Colors

A. Typography

Aa Zz

Helvetica Neue - Bold

Aa Zz

Helvetica Neue – Regular

DESKTOP > 1024 / TABLET + MOBILE (<1024px)

Style 1: Cooper Lt BT

Helvetica Neue – Bold / font-size: 35px; / line-height: 40px; / color: #000000


Style 2: Cooper Lt BT

Helvetica Neue – Bold / font-size: 25px; / line-height: 20px; / color: #000000


Style 3: Cooper Lt BT

Helvetica Neue – Bold / font-size: 13px; / line-height: 20px; / color: #000000


Style 4: Cooper Lt BT

Helvetica Neue – Bold / font-size: 13px; / line-height: 20px; / color: #000000


P1: Used for most text paragraphs. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In facilisis dolor in risus condimentum euismod. Integer dictum consectetur feugiat. Nullam mauris lacus, tincidunt id ligula sit amet, imperdiet congue dolor.

Helvetica Neue – Regular / font-size: 13px; / line-height: 20px; / color: #000000


P2: Used for most text paragraphs. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In facilisis dolor in risus condimentum euismod. Integer dictum consectetur feugiat. Nullam mauris lacus, tincidunt id ligula sit amet, imperdiet congue dolor.

Helvetica Neue – Regular / font-size: 11px; / line-height: 16px; / color: #000000


B. Colors

Fills

Black

White

Grey

LINES

Black Line
#000000 / 1px
(Used for section breaks)

White Line
#FFFFFF / 1px
(Used for section breaks)


02 — UI Elements

Link


PDP BTN


Carousel Arrows

AMBIENT VIDEO CONTROLS


SIZE VARIANT SELECTOR [same as desktop + mobile]


Checkbox



Input field

Product card