Community & Membership Website Design Examples

37 real sites · 858 sections

There are 37 community & membership website designs here — live sites that run communities, clubs or memberships, including Hugging Face, GitHub, Soho House, Equinox and Going — cut into 858 sections. 76% use a light theme and 24% a dark one; the most common headline fonts are Headfont (2), Source Sans Pro (1) and Mona Sans (1). 20 of 37 open with a hero, 7 show pricing on the homepage and 10 carry testimonials.

At a glance

Sites: 37
Sections captured: 858
Light / dark: 76% light · 24% dark
Top heading fonts: Headfont (2), Source Sans Pro (1) and Mona Sans (1)
Accent colours: neutral 9blue 9orange 6
Most common sections: features (32), hero (20), statement (17) and call to action (14)
Top industries: Health & Fitness (15), Lifestyle (7) and Travel (2)
Award winners: 4 of 37

What makes a good community & membership website design

Community and membership sites sell belonging: who is inside, what members get, events and spaces, and a clear application or join flow.

What these 37 community & membership websites have in common

Measured from the captures, not opinion — use it to plan a community & membership website against what already works.

Sections they use

32 include features, 20 include hero, 17 include statement and 14 include call to action. 9 answer objections with an FAQ and 14 (38%) close with a dedicated call to action. Read top to bottom, the most common running order is hero → features → footer → call to action → logo cloud. Compare them side by side: features section examples, hero section examples, statement section examples.

Type and colour

Light layouts lead (76% vs 24% dark). Headlines are most often set in Headfont (2), Source Sans Pro (1) and Mona Sans (1). The most common accent hues are neutral (9), blue (9) and orange (6). Every example lists its exact fonts and hex palette on its page.

Page length

The average homepage here is about 6,430px tall at desktop width — roughly 7 screens of scrolling, with GitHub the longest at 11,000px. Open any site to scroll the full-page capture and see where each section falls.

37 community & membership website designs worth studying

Calibrate — “We’re changing the way the world treats weight. Calibrate is a metabolic reset that addresses the root of weight issues from the inside out.” 45 sections, headlines in Graphik, light theme, palette #ffffff and #211e3f; the homepage runs hero → features → testimonials → call to action.
Hugging Face — “We’re on a journey to advance and democratize artificial intelligence through open source and open science.” 10 sections, headlines in Source Sans Pro, light theme, palette #ffffff and #000000; the homepage runs hero → statement → features → statement.
F45 — “Change your life with F45 Training. Try our high-intensity, functional fitness classes at all fitness levels across 1,500 gyms alongside 300,000 global members. Start today!” 17 sections, headlines in Gotham Condensed, light theme, palette #ffffff and #d6001c; the homepage runs call to action → features → testimonials → features.
House — “Creative project membership with an exclusive team for unlimited use. Month to month.” 10 sections, headlines in Neue haas grotesk display, light theme, palette #ffffff and #111010; the homepage runs hero → features → testimonials → faq.
Atlas Coffee Club — “Your own personalized subscription. 50+ countries grow coffee. We designed a subscription to help you discover the best. First bag 50% off, starting at $7.” 47 sections, headlines in Jost, light theme, palette #f9e124 and #ffffff; the homepage runs call to action → features → logo cloud → features.
Stag's Leap — “On one of California’s earliest wine estates, a unique terroir and ideal microclimate support a classical standard of viticulture, land use, and winemaking that is as relevant today…” 22 sections, headlines in Cormorant, light theme, palette #ffffff and #2a2d33; the homepage runs features → statement → footer.

How to use these references for a community & membership website

Show real members and events, list membership benefits plainly and make the join or apply step feel exclusive but simple. Start with Hugging Face, GitHub and Soho House, 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.