Back to Case Studies
Case Study — From-Scratch Design

Leafora — Premium Tea Brand Homepage Design

Designed from a single client brief: premium, calm, and earthy — without a single cliché.

Tools: Figma | Gemini & Chatgpt (for image generation)
Role: Solo Designer
Performance Against Requirements

How the Design Measures Up Against the Brief

Brief Alignment Score (1–10, subjective self-assessment)
Premium, calm feelScore: 9/10
Earthy without cliché (no green/brown overload)Score: 9/10
Editorial / Aesop-Kinfolk toneScore: 9/10
All 6 required sections deliveredScore: 10/10
Distinct from typical tea-brand sitesScore: 8/10
Target audience fit (25–40 urban professional)Score: 8/10

The Brief

Leafora is a single-origin tea brand sourcing directly from farms in Darjeeling, Assam, and Nilgiris, targeting urban professionals aged 25–40 who care about quality, wellness, and aesthetics. The founder, Rohan Mehta, came in with a clear point of view:

"I don't want it to look like every other tea website with just green and brown slapped everywhere. Be more thoughtful than that."

The ask was a desktop homepage design covering six sections — Hero, About/Brand Story, Featured Products, Why Leafora, Testimonials, and Footer — with the explicit reference points Aesop and Kinfolk: clean, intentional, a little editorial, premium without being boring.

The Challenge

The brief's hardest constraint wasn't a section list — it was a feeling to avoid. Most tea and wellness brands default to the same visual shorthand: forest green, kraft-paper brown, leaf iconography, rustic serif logos. Leafora needed to feel earthy and premium without falling into that template, while still communicating "tea," "single-origin," and "sourced with care" at a glance.

The solve was to shift the palette away from literal tea colors entirely — toward warm neutrals (cream, sand, linen) with a single confident accent (a muted terracotta/rust) — and to let mood-lit photography, not iconography, do the work of signaling quality and origin.

The Design

Section 01

Hero

A full-bleed, warm-lit photograph of three Leafora tins styled on linen with dried flowers, cinnamon, and roses — the kind of editorial food styling you'd see in a Kinfolk spread, not a product shot on white. A small tracked label ("Single-origin teas from India's finest gardens") sits above the headline, "Tea, the way it was meant to be," set in a large, quiet serif with a single "Discover the collection" CTA — restraint over a hero full of competing buttons.

Section 02

Brand Story

Rather than a paragraph of marketing copy, the About section is a single centered pull-quote from the founder, in italic serif, attributed simply as "— Rohan, Founder." It reads like a magazine feature, not an About Us page, and does more to build trust in three sentences than a longer bio would.

Section 03

Why Leafora

A 2×2 card grid on a warm tan background presents the brand's four differentiators (Single-origin always, Direct farm partnerships, Harvested to order, Third-party tested), each numbered 01–04 in the terracotta accent color. Numbering gives the grid structure and intentionality rather than feeling like a generic feature list.

Section 04

Featured Products

Four teas (Morning Mist, Ember Chai, Nilgiri Dusk, White Peony) are shown as styled photography — tins on linen with props like dried orange, star anise, and a single flower — rather than flat catalog shots. Each card carries a small terracotta category tag (e.g. "Darjeeling · First Flush"), a one-line tasting note, price, and a quiet "View →" link. A "Rare" badge on White Peony adds scarcity without shouting.

Section 05

Testimonials

A single large italic quote on a soft beige field, with a quotation-mark accent and simple carousel navigation — one voice at a time, matching the unhurried, editorial pace of the rest of the page rather than a busy grid of star ratings.

Section 06

Footer

The page closes on a deep charcoal-black band — the only dark section on the page — grounding the palette and giving the brand wordmark ("From the garden, for the quiet morning") a moment of quiet contrast against the cream body above it.

Design Rationale

Brief RequirementHow It Was Addressed
"Premium, calm, earthy, not boring"Neutral cream/sand/linen palette with a single terracotta accent instead of literal green/brown
"Aesop / Kinfolk vibe"Editorial serif typography, generous whitespace, styled lifestyle photography over product-on-white shots
"Clean, intentional, a little editorial"Numbered sections, pull-quotes, small tracked labels — magazine-style structure throughout
All six required sectionsHero, Brand Story, Why Leafora, Featured Products, Testimonials, and Footer all present and in a logical narrative order
Avoid the "every other tea site" clichéNo leaf iconography, no forest green — mood and photography carry the "tea" signal instead
Final Outcome

Outcome

The result is a homepage that reads closer to a lifestyle or wellness editorial than a typical tea e-commerce template — meeting Leafora's premium positioning and giving Rohan a first draft that directly answers the one instruction he was most explicit about: don't make it look like every other tea site.