# Postcards by Elle — longform design study

## Overview

Postcards by Elle is a personal-essay, slow-living newsletter on a customised Substack. The design reads like a diary you were handed rather than a feed you scrolled. Its whole personality comes from colour temperature: cream paper, monochrome warm-brown serif type, and a single line of pink hand-script at the top. There is almost no decoration. The warmth is in the palette and the pacing.

The example article studied is "morning walks and listening to full albums will save you" (postcard 69).

## How it structures longform content

The reading order is fixed and repeats every issue, which turns the header into a small ritual:

1. Masthead — a stamp-style logo on the left, the pink Caveat-style script wordmark centered, and Subscribe / Sign in on the right.
2. Kicker — "POSTCARDS" in small uppercase letter-spaced type.
3. Title (H1) — Lora bold, warm brown.
4. Subtitle — Lora, taupe, one line.
5. Meta — the date (with a Listen pill added on mobile).
6. Engagement pill bar — heart / comment / restack counts as outline pills on the left, Share pill on the right.
7. Epigraph — the first paragraph set as an italic Spectral line with a large serif drop cap and a left hairline, followed by a full-width hairline rule.
8. Lowercase section head — e.g. "prelude" in Lora 500.
9. Body — Spectral, with rounded contained images between passages.

Hierarchy devices: the italic drop-cap epigraph acts as an entry threshold; lowercase serif section heads organise the piece without raising their voice; hairline rules separate movements; the pill bar provides social proof without colour.

Imagery strategy: photographs are contained to the reading column and given a ~14px corner radius. Nothing is full-bleed. Even a hard-edged interior shot feels soft because of the rounding and the containment.

## Desktop treatment

- Body: Spectral 20px with a 32px line-height (1.6), warm brown #5D4C37 on cream ~#F6F1E7.
- Title: Lora bold (600), scaling up to about 2.6rem.
- Subtitle: Lora in muted taupe.
- Measure: 728px column, roughly 73 characters per line.
- Masthead: stamp logo left, centered script wordmark, Subscribe pill (dark brown) plus Sign in on the right.
- Engagement: outline pill bar with heart / comment / restack and a Share pill.
- Epigraph: italic Spectral, larger than body, with a serif drop cap and a left hairline.
- Images: rounded, contained to the 728px column.
- Document height: about 14,500px for the full essay.

## Mobile treatment (390px)

- Body: Spectral steps down to 18px with a 28.8px line-height (still 1.6).
- Measure: 348px, roughly 39 characters per line.
- Masthead: logo centers and compacts; Subscribe becomes sticky as you scroll.
- Meta row: gains a Listen pill next to the date.
- Title: wraps to three or four lines but keeps the same Lora weight.
- Images: rounded, edge to edge within the gutters.
- The layout does not restructure. It relaxes — the column narrows and the body shrinks two pixels, and the reading experience is otherwise identical.

## Design system (tokens)

Type:
- Headings: Lora, weights 500 and 600. Title 600 at clamp(2rem, 5vw, 2.6rem).
- Body: Spectral 400, 20px / 1.6 desktop, 18px / 1.6 mobile.
- Wordmark: Caveat (700), pink, standing in for the hand-lettered logo.
- Section heads: Lora 500, lowercase.
- Drop cap: Lora 600, about 4.2em, floated on the epigraph's first letter.
- Epigraph: Spectral italic, larger than body, left hairline.

Colour:
- Cream paper — #F6F1E7
- Warm-brown ink — #5D4C37
- Muted taupe — #868480
- Hairline — #E4DBCB
- Pink accent — #D6336C (used once, on the wordmark)
- Button dark-brown — #43382A

Layout:
- Centered single column, measure 728px (~73 CPL desktop, ~39 CPL mobile).
- Leading 1.6 throughout.
- Sticky masthead; sticky Subscribe on mobile.
- Rounded contained images at ~14px radius; no full-bleed media.

## Signature techniques

- Cosy diary feel built entirely from colour temperature, not ornament.
- Monochrome warm-brown serif on cream, with exactly one pink hand-script accent.
- Drop-cap italic epigraph as the way into the essay.
- Lowercase serif section heads that organise without interrupting.
- Outline pill UI for engagement, and pill-shaped controls generally.
- Soft, rounded, column-width imagery.

## What to steal

1. Let colour temperature carry the mood — a single warm palette does the emotional work that illustration usually does.
2. Reserve one accent for one job — pink appears only on the wordmark, so it reads as a signature, not decoration.
3. Open long text with a ritual — a drop cap plus an italic epigraph tells the reader to slow down before the first sentence.
4. Keep section heads quiet and lowercase — structure does not have to announce itself.
5. Round your imagery — a soft 14px radius and column-width containment keep even a busy photo calm.

## Visual references

- Desktop: ../assets/screenshots/03-elle-desktop.jpeg
- Mobile: ../assets/screenshots/03-elle-mobile.jpeg

## Source URL

https://postcardsbyelle.substack.com/p/morning-walks-and-listening-to-full