RAA' v2

Design system

Every component on this site draws from the tokens below. Arabic and Latin share one scale; Latin labels switch to tracked capitals.

Colour

Ink#1C1A17 · Text, actions

Ink hover#33302A · Hover

Ground#FAF8F4 · Page

Surface#FFFFFF · Cards, panels

Plate#F1ECE5 · Image plate

Band#F3EEE7 · Bands, active

Line#E7E0D6 · Borders

Line strong#D6CCBD · Inputs

Text 2#5C554B · Secondary

Tan#8C7658 · Labels, icons

Rose#8B4A46 · Badges

DisplayCormorant 400 · 38–60 · 1.08From one shelf

H1Cormorant 400 · 30–40All products

H2Cormorant 400 · 28–36The daily ritual

Section17 · 600 · caps .1emBest Sellers

Body15 · 300 · 1.65Cica, ceramide and panthenol formulas that calm, repair and prepare skin for the rest of the routine.

Product title14 · 500 · 1.45 · 2 linesRelief Sun Rice + Probiotics SPF 50+ PA++++

UI / Meta13 · 400On orders over 1,200 EGP

Label12 · 500 · caps .14emShop by concern

Controls4px

Cards, panels8px

Icon buttons, tags999px

E10 1 2 / 0 8 24 · 6%

E2 hover0 2 4 / 0 14 32 · 9%

Container1320px

Gutter16 → 40px

Section48 → 72px

Grid gap12 → 20px

Card padding12 → 16px

Image ratio1 : 1 · 76%

Button / field48 / 44px

Icon button40px

Icons16 · 20 · 28 · 1.6 stroke

Mobile< 720

Tablet720–1099

Desktop≥ 1100

Buttons, tags and badgesView all

HydrationSun Care ×Best seller