Starting point

A hair salon website that prices colour before anyone calls

A salon loses appointments to one question it will not answer online: how much is balayage. So what the website builder hands a hairdresser is a menu that answers it — every service with a price and a length, and three stylists carrying the hours they actually work.

Hair Salon website template — the home page it produces

Shown in the Velvet design style — one of 15 you can switch between; your business content carries over.

The full homepage
Hair Salon website design example — The full homepage
A full inner page
Hair Salon website design example — A full inner page
Another full inner page
Hair Salon website design example — Another full inner page

Colour has a price and a duration. Say both.

The sample service list is grouped the way a salon quotes: cuts, colour, treatments. Every line carries what it costs and how long the chair is occupied — a signature cut at 60 minutes, balayage at 180 — because a client planning a Saturday needs the second number as much as the first. Each of the three stylists has a role, a bio and a weekly shift table, so the site can say who is in on a Tuesday rather than showing three faces and a phone number.

What the sample site comes with

Three service sections holding eight priced services from 30 to 180 minutes, three stylists with weekly shift tables, a six-image lookbook, three sample reviews, a first-visit discount code, and five pages.

Anything on that list that takes something from a visitor or reads from a live schedule — a form, a booking, a coupon code, a subscribe box, a class timetable, a listing fed by a collection — goes online with Storefront Pro. Storefront publishes the rest of the page exactly as you built it; where this template gives one of those a page of its own, that page is the one that waits for the upgrade.

What the site covers

5 pages included

What is in scope, and what stays in your own systems

Prices and stylists are sample content to overwrite. The site shows the menu and the roster; it is not a chair-management or till system, and product retail is not part of this starting point.

Every count and price on this page was read out of the template itself rather than written by hand, which is why the numbers match the site you actually get.

What you get when you publish it

Questions people actually ask

This starting point has a Stylists page as well as a Book page. How do the two stay in step?

They read one list. Each stylist is a single record — name, role, short bio, photo, and the hours worked on each weekday — kept in the Staff tab of the site's booking desk. The Stylists page prints those three as team cards above a six-frame portfolio grid; the same three names become the chips a customer picks from on the Book page, and their weekday hours decide which times that customer is offered. Change a role or a day off once and both pages follow. Switching design style later keeps the staff list intact.

Balayage runs three hours and takes a deposit; a kids' cut is thirty minutes and takes none. Can one Book page handle both?

Yes, because length and deposit are fields on each service, not settings for the site. The booking form opens with the three menu tabs — Cuts, Color, Treatments — and prints each service's length underneath its name. Choose the three-hour balayage and the page offers only times where that stylist has three unbroken hours inside their shift, with a ten-minute buffer either side, and the confirm button becomes Pay deposit & book for exactly the amount that service carries, re-checked on the server. Choose the kids' cut and it looks for thirty minutes and asks for no card.

Still comparing? See how eight builders handle this trade, with dates and sources.