Serif Website Design Examples
140 real sites · 3,638 sections
There are 140 serif website designs here — live sites that set headlines in a serif typeface, including Railway, Resend, Zed, Craft and Oura — cut into 3,638 sections. 89% use a light theme and 11% a dark one; the most common headline fonts are Tiempos Headline (7), Playfair Display (7) and Canela (6). 79 of 140 open with a hero, 22 show pricing on the homepage and 34 carry testimonials.
At a glance
Live verified metrics- Sites
- 140
- Sections captured
- 3,638
- Light / dark
- 89% light · 11% dark
- Top heading fonts
- Tiempos Headline (7), Playfair Display (7) and Canela (6)
- Accent colours
- neutral 59blue 40red 15
- Most common sections
- features (120), hero (79), statement (78) and showcase (56)
- Top industries
- Lifestyle (17), Shopping (14) and Fashion & Beauty (14)
- Award winners
- 19 of 140
Filter
Industry
Exact colour
What makes a good serif website design
Serif headlines signal editorial, heritage or craft: they slow the reader down and add warmth, often paired with a clean sans for interface text.
What these 140 serif websites have in common
Measured from the captures, not opinion — use it to plan a serif website against what already works.
Sections they use
120 include features, 79 include hero, 78 include statement and 56 include showcase. 35 answer objections with an FAQ and 56 (40%) close with a dedicated call to action. Read top to bottom, the most common running order is hero → features → footer → call to action → statement. Compare them side by side: features section examples, hero section examples, statement section examples.
Type and colour
Light layouts lead (89% vs 11% dark). Headlines are most often set in Tiempos Headline (7), Playfair Display (7) and Canela (6). The most common accent hues are neutral (59), blue (40) and red (15). Every example lists its exact fonts and hex palette on its page.
Page length
The average homepage here is about 7,307px tall at desktop width — roughly 8 screens of scrolling, with Railway the longest at 11,000px. Open any site to scroll the full-page capture and see where each section falls.
140 serif website designs worth studying
- Zed — “Zed is a high-performance, multiplayer code editor from the creators of Atom and Tree-sitter.” 56 sections, headlines in Plex Serif, light theme, palette #0000107 and #010000; the homepage runs hero → testimonials → features → stats.
- Craft — “A free notes and productivity app that follows you across all your devices. Premium features available.” 17 sections, headlines in Untitled Serif Font, light theme, palette #030302 and #fcf9f7.
- Linktree — “Join 70M+ creators and sell, share & curate everything you do online. One bio link—your Linktree—brings it all together for your audience.” 22 sections, light theme, palette #000000 and #efefef.
- ReadMe — “ReadMe helps you create beautiful, interactive API documentation that developers love.” 37 sections, headlines in STKBureau Serif, light theme, palette #030101 and #030000.
- Plum Guide — “Plum Guide handpicks the world's best vacation rentals, holiday homes, short term lets and Airbnbs from over 25 different sites” 52 sections, headlines in Domaine Display Narrow, light theme, palette #1d1d1d and #000000; the homepage runs hero → statement → showcase → testimonials.
- Mutiny — “Be the one buyers remember. Join the frontier of how the best enterprise sales teams operate.” 37 sections, headlines in Reckless Condensed S TRIAL, light theme, palette #ffffff and #000000; the homepage runs hero → logo cloud → features → call to action.
How to use these references for a serif website
Pair one serif display face with a neutral sans for body and UI, set headlines large with tight leading, and keep the rest of the layout quiet. Start with Railway, Resend and Zed, open each site at full size and compare their features and hero sections; every reference carries its palette, fonts and a build prompt you can paste into your editor.
Featured serif website examples with their fonts
- Railway
Fonts: IBM Plex Serif / Inter
- Resend
Fonts: Domaine / Inter
- Zed
Fonts: Plex Serif / Writer
- Oura
Fonts: Editorial New / Akkurat LL
Related searches
Browse all websites or the full A–Z of popular searches.
How this list is built: 140 sites from the UI Discovery library that set headlines in a serif typeface, matched on each product's own title, description and headline copy, captured styles, colours and fonts. Ordered by popularity.
Library updated