Barbershop Website Design SystemDESIGN.md alpha
A barbershop website design system for classic and modern barbers, grooming lounges and shave parlours. It should feel like a well-kept shop with leather chairs and brass details: confident, masculine without cliches, and tidy. Booking a chair with a favourite barber must take less than a minute. Fonts were chosen with full Latin Extended coverage, so Polish, Czech and other Central European diacritics (ą, ę, ł, ż, ř, ů) render correctly in every weight.
Color Palette
Typography
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Every letter tells a story worth reading, and every typeface gives that story a new voice waiting to be heard.
Corner Radius
Spacing
Base: 4pxA barbershop website design system for classic and modern barbers, grooming lounges and shave parlours. It should feel like a well-kept shop with leather chairs and brass details: confident, masculine without cliches, and tidy. Booking a chair with a favourite barber must take less than a minute. Fonts were chosen with full Latin Extended coverage, so Polish, Czech and other Central European diacritics (ą, ę, ł, ż, ř, ů) render correctly in every weight.
Components
Buttons
Inputs
Cards
Card Title
Sample body text for the card component.
Card Title
Sample body text for the card component.
Card Title
Sample body text for the card component.
Chips
eyebrow
default
default
default
default
default
default
default
badge
success
alert
error
Do's & Don'ts
Do
Don't
Use with MCP
Don't have the MCP? Install it here