Skip To Content

Showcase Build · Edinburgh

A Quietly Elegant Site For A Fictional Edinburgh Nail Studio.

A single-page beauty build shaped around calm confidence, booking intent, and soft editorial detail.

Halcyon Nails homepage

This is a fictional brand we built end-to-end as a showcase. The build is real; the company is not.

Background

The Brief Behind The Brand.

The brief imagined a nail studio close to Edinburgh's Royal Mile: intimate, appointment-led, and more interested in trust than loud sales language. The brand needed to feel polished enough for bridal and BIAB customers, but still warm enough for a first-time visitor choosing a technician from their phone.

We treated the page as a high-density salon landing page: hero, services, gallery, team, good-to-know notes, reviews, and a final find-us section, all designed to answer the questions that usually sit inside Instagram DMs.

Build

Visual System, Motion, And Structure.

The visual system uses a mauve accent, petal blush surfaces, and cream cards rather than harsh white. Fraunces gives the page a soft editorial spine, Plus Jakarta Sans keeps service details readable, and Caveat is used sparingly for hand-written flourishes. The result is deliberately feminine without becoming cluttered.

The motion vocabulary is playful but contained. The demo includes slow floating stickers, twinkle states, a shimmer treatment, and small bouncy hover lifts. Those details are decorative only, with reduced-motion handling in the CSS so the site still reads cleanly for visitors who prefer less movement.

Structurally, the page behaves like a salon reception desk. Service tabs group nails, BIAB, lashes, and brows; the gallery opens into a polaroid-style lightbox; team cards introduce the people behind the appointments; and contact details sit where a ready-to-book visitor expects them.

What's Wired

The Practical Foundations.

Schema

The demo deploys NailSalon JSON-LD with contact details, opening hours, postal address, price range, and social profile reference.

Accessibility Floor

Visible focus rings, semantic sections, labelled interactive elements, and decorative layers marked away from assistive technology.

Motion Budget

Float, twinkle, wobble, pop-heart, shimmer, and marquee effects are lightweight and gated by reduced-motion rules.

Fonts

Fraunces for display type, Plus Jakarta Sans for body copy, and Caveat for small script accents.

Colour

Mauve #b8656b, cream, petal blush, rose ink, and soft gold support a light-only canvas.

Specs

Build Specs.

Stack
Next.js 16 · React 19 · Tailwind v4 · JSON-LD · Responsive Image Assets
Pages Count
1
Duration
2 Weeks For The Showcase
Shipped
2026-04-12

Sister Builds

Three More Builds.

More builds across other locked directions and locales.

See Our Work
The Pawtisserie showcase homepageLive
PembrokeshirePet Bakery
The Pawtisserie

Pembrokeshire's first doggy café, served on stitched paper.

Paprika Club showcase homepageLive
Leamington SpaRestaurant
Paprika Club

Family-run. Saffron-stained. Lord-approved.

Sher showcase homepageLive
Sutton ColdfieldRestaurant
Sher

Feast like a lion.

Start Here

Build Like This

Send the brief with the build that feels closest to your business, and we will reply with the practical package fit.