Every colour, font size, space, shadow, and animation used in your app. Once locked, every screen we build obeys this rulebook — so nothing ever looks out of place.
Colour palette
12 colours · used consistently throughout
Warm Cream
#FAF5EB
App background
Cream Tinted
#FBF3DF
Gold-rate card, highlights
Surface
#FFFFFF
Product cards, inputs
Hairline
#EBE0C8
Borders, dividers
Gold (primary)
#B8892A
Prices, key actions, brand
Gold Bright
#D4A843
Highlights on dark bg
Gold Deep
#8A6820
Hover state, pressed buttons
Ink (text)
#1A1410
Main body text, titles
Ink Muted
#5C4E3D
Secondary text, descriptions
Ink Subtle
#8B7B67
Labels, metadata, timestamps
Festive Red
#C2410C
Akshaya / Diwali accent · sparingly
Success
#15803D
Rate up, paid status, confirmations
Typography scale
Playfair Display (serif) for elegance · Inter (sans) for reading
Display34 / Playfair 500
Welcome back, Vimal
Heading 128 / Playfair 500
The Akshaya Edit
Heading 222 / Playfair 500
Just arrived
Heading 317 / Playfair 500
Lotus Ring
Body15 / Inter 400
22K gold, 6.8 grams, handcrafted in our Perambalur workshop.
Small13 / Inter 400
Comes with BIS hallmark and lifetime buyback at daily rate.
Caption11 / Inter 500
Tap heart to save · price alerts free
Overline10 / Inter 700
Today's rate · 22K
Spacing scale
A 4-based system · pick one of six, never a random number
s1
4 px
s2
8 px
s3
12 px
s4
16 px
s6
24 px
s8
32 px
Corner radii
Five standard rounding sizes for different uses
r-sm
Badges, pills
r-md
Product cards, inputs
r-lg
Main content cards
r-xl
Hero, modals, sections
r-pill
Buttons, chips, tags
Elevation (shadows)
Three depth levels · warmer shadow (not cold grey)
Shadow 1
Cards resting on background · product tiles
Shadow 2
Raised cards · hero · featured collections
Shadow 3
Modals · bottom sheets · floating tooltips
Motion
Two timing curves · slow + confident, never snappy
StandardTab switches, content reveal
320 ms
EmphasizedHero transitions, page enter
500 ms
FastButton press, hover, haptic feedback
200 ms
Core components
Ready-made building blocks · every screen uses these
Buttons — 5 variants, all tuned to Heritage Cream
Primary · gold brand CTA
Cream · tone-on-tone secondary · blends with app bg
Outline · bordered secondary
Dark · high emphasis (warm ink, gold text — never cold black)
Ghost · tertiary link
Pairing rule: Primary + Cream together (Book + Directions). Primary + Outline if secondary is rare. Dark used alone on cream bg for max emphasis — never two-per-screen. Icon rule: Before the label for actions (Book, Call, Navigate); after for outward links (See details →).
Cards
Today's rate · 22K
₹6,640 per gram
Updated 9:41 AM · ▲ ₹12 from yesterday
New collection
The Akshaya Edit
22 bridal pieces handcrafted in Perambalur.
Surface card (white) · warm card (cream-tinted for featured content)
Inputs
Focus state: gold border + soft gold halo
Pills / chips
AllRingsNecklacesEarringsChains✓ Paid⋆ Akshaya
Filters, status labels, seasonal accents
This is the only rulebook the app will follow.
Once locked, every new screen we design will use these exact colours, fonts, spacings, corners, shadows, and animations. Nothing will ever look out of place.