Brand guidelines · v1

The loop star.

SAAHB — «صاحب» — is Arabic for a friend: the regular the café knows by name. The mark is one continuous line folded into an eight-point star, the Rub el Hizb geometry found across the region’s architecture, closing around a single saffron stamp. It is a loop that keeps coming back, which is what loyalty is.

01 · Construction

Two squares, one loop

Two equal squares, the second rotated 45°. Their union outline is drawn once, with round joins.

Clear space: keep at least ¼ of the mark’s height empty on every side.

16px

24px

32px

48px

Minimum size 16 px on screen. Below 24 px use the mark alone, never the wordmark.

02 · Lockups

Bilingual by design

صاحب

Primary header lockup

SAAHB

صاحب

SAAHB

The Latin wordmark is set in Readex Pro SemiBold capitals with +6% tracking. The Arabic name «صاحب» (ṣāḥib, “friend”) uses the same family at normal tracking, so both scripts share stroke weight and rhythm. On busy or brand-colour backgrounds use the single-colour mark.

Headers use the bilingual lockup: both names side by side, joined by the saffron stamp, with the page’s language first. The Arabic writes itself in right-to-left; it is never split into letters, so the joins stay intact.

03 · Colour

Oasis night, luminous mint, saffron

Oasis Night

#04080A

Canvas. The default background for brand moments.

Night 800

#0C171B

Raised surfaces, cards, devices.

Luminous Mint

#2DE1C2

Primary accent: actions, progress, focus.

Contrast on Oasis Night 12.1:1 · AA text

Halo Cyan

#5EE7FF

Secondary accent: gradients, data highlights.

Contrast on Oasis Night 13.7:1 · AA text

Saffron

#F2C14E

Rewards, stamps, celebration. Use sparingly.

Contrast on Oasis Night 12.0:1 · AA text

Desert Sand

#E9DCC3

Warm neutral for print and light surfaces.

Contrast on Oasis Night 14.8:1 · AA text

The aurora gradient (cyan → mint → saffron) is reserved for the mark, hero headlines and the primary call to action. Never place body text on it.

04 · Typography

One voice in two scripts

Display · Readex Pro

أب

Headlines and the wordmark, Latin and Arabic. Tight tracking (−3% to −4.5%) at large sizes.

Text · Inter / IBM Plex Sans Arabic

أب

Interfaces and body copy. 16 px minimum, 1.5–1.7 line height.

Data · JetBrains Mono

12.500

KWD · 3 decimals

Amounts, codes, technical labels. Always tabular figures for money.

05 · Motion

Confident, never frantic

Ease
Expo-out, cubic-bezier(0.16, 1, 0.3, 1). Things arrive fast and settle softly.
Duration
150–300 ms for interface feedback, up to 1.4 s for brand reveals (the loop drawing itself).
Meaning
Motion always tells the loyalty story: a stamp pressing in, a pass syncing, a reward unlocking.
Respect
Honour reduced-motion settings and offer a visible pause control. The page must read perfectly without motion.

06 · Misuse

Please don’t

✕ Stretch or skew

✕ Rotate the star

✕ Recolour the stamp

✕ Add effects

07 · Voice

Warm, precise, bilingual

“Your 10th coffee is on us.”

Speak like a good host: short, generous, specific. Lead with what the customer gets.

«قهوتك العاشرة علينا.»

العربية تُكتب أولًا وليست ترجمة: عبارات طبيعية، وأرقام وعملات بصيغتها الصحيحة.

Never invent numbers or testimonials. If it isn’t measured, it isn’t claimed.