A library of website design styles
Copy the idea, not the code.
Website Design Explorer is a library for exploring website design styles. See each style as a live, original example page, learn the rules that make it work, and take away a recipe you can hand to a designer or an AI assistant.
Field notesSample recipe
- Background
- Text
- Accent
A sturdy serif for headings, a plain sans for reading.
- DoLeave generous space around every heading.
- Don’tUse the accent for more than one thing per screen.
How it works
See it live
Every style has its own original example page. Switch between phone, tablet and desktop width to see how it holds up.
Understand the rules
Read what makes the style work: its principles, palette, type, spacing, and the do’s and don’ts that keep it honest.
Copy the recipe
Take the idea with you as a written brief or design tokens, ready to paste into a design tool or an AI assistant.
Featured styles
Six very different directions, each with its own original example page. Open one to see it live.
- Swiss gridA strict grid, big sans-serif type and asymmetric layout do all the work; nothing is there for decoration.See the example
- Editorial magazineReads like a well-set magazine: confident serif headlines, generous columns, pull quotes and fine rules.See the example
- Neo-brutalistRaw, loud and honest: thick black borders, hard offset shadows, flat clashing colours and unpolished type.See the example
- Soft minimalCalm and airy: lots of space, soft neutral colours, gentle rounded corners and one quiet accent.See the example
- Playful roundedFriendly and bouncy: chunky rounded type, pill-shaped buttons, bright candy colours and wobbly shapes.See the example
- Dark luxuryQuiet expense: a deep dark ground, a refined serif, thin gold lines, slow fades and very little on screen.See the example