E2®
Join the community

THE TEMPLATE

What we think a well designed website looks like.

This is the design template the E2 network runs on. It was written down first at Starvard, our free university, and it belongs to every land here. One design language, everywhere, so the whole universe feels like one place.

Six principles, in order.

Everything in the template serves these. When two of them fight, the earlier one wins.

01

Interesting first

A page must earn its place. If the content is dull, no layout will save it, so the template assumes the words and pictures are worth a stranger's minute and gets out of their way.

02

One idea per section

Each band of the page does one job and then stops. Readers scroll through arguments, not piles. White space is not emptiness; it is the punctuation.

03

Speed is a feature

Our house target is three quarters of a second, half a second on a good day. System fonts, small images, no framework tax. A beautiful page that loads slowly is a slow page with makeup on.

04

Two voices of type

Georgia, the serif, speaks for the soul: headlines and long reading. The system sans speaks for the machine: buttons, labels, navigation. Both already live on your device, so nothing is downloaded and nothing jumps around while loading.

05

Color with a job

Navy carries structure and trust. Gold marks the one thing that matters most on the screen. Ivory warms the cards. That is the whole palette, and restraint is what makes it read as expensive.

06

Honest by default

No popups, no sticky bars eating the page, no dark patterns, no pretending. Prices, limits, and caveats in plain words, and an accuracy note in the footer of every page. Trust is the brand.

The pieces, live.

Every specimen below is rendered with the template's real values, the same ones running this page. Copy them exactly and your page will feel like ours.

Navy#16233F · structure, headings, buttons
Navy Deep#0E1830 · footer, the darkest ground
Gold#B58520 · the one thing that matters
Gold Soft#E8D9B0 · callout borders, quiet fills
Ivory#FAF7F0 · cards and warm surfaces
Ink#1D1D1F · body text on paper white
Headlines that must be understood at a glance.
The serif carries anything longer than a breath. It has been on every computer for decades, and it reads like a book.
DISPLAY: SYSTEM SANS 40 TO 64 · READING: GEORGIA 18 TO 21 · LABELS: TRACKED CAPITALS
The gold callout means one thing everywhere in the network: do this. The one action that matters, the homework that is actually worth it. One per section at most, or it stops meaning anything.
0.75shouse speed target, 0.5s on a good day
0webfonts downloaded, ever
0popups, sticky bars, dark patterns
1140pxthe stage width, with air on both sides

Rules we refuse to break.

The navigation scrolls away.

It never sticks to the top and covers what you are reading. Your place on the page is yours.

One gold thing per screen.

If everything is highlighted, nothing is. Gold is a spotlight, not a paint.

No text inside images that the page depends on.

Text is text: searchable, translatable, readable aloud.

Every image earns its bytes.

WebP, sized for its slot, lazy below the fold. Decoration that costs a second costs the reader.

Links look like links and buttons look like buttons.

Nobody should have to guess what is tappable.

It must work with the network having a bad day.

Semantic HTML first; the page reads fine before any script wakes up.

Translated pages are the same design, not a lesser one.

The template travels with the words.

The footer tells the truth.

Who made this, what it costs (nothing), and an honest note about accuracy.

Steal this template.

Seriously. The fastest way to spread good design is to give it away. The full original, with the copy-paste starter skeleton, lives at Starvard: starvard.org/template. View source on this page and take the whole thing. Free forever.