Postdrome — brand sheet

Brand identity. Half-sun horizon mark, lowercase serif wordmark. This document indexes every asset in the bundle and shows correct usage. The brand DNA: a quiet horizon at the moment after.

Color

Teal is the primary brand color and carries the half-sun mark. Slate is the structural color — text, UI chrome, monochrome marks. Amber is the half-sun and should appear sparingly elsewhere; it is a punctuation color, not a fill color. Paper is the surface. Lilac is held in reserve and may not ship.

Typography

Source Serif 4 for display and headlines. Apple system font (San Francisco) on iOS and Inter on web for body and UI. Lowercase wordmark. Sentence case throughout — never title case, never all caps.

Made for people whose migraine doesn't fit the attack model.

Source Serif 4 · 48px · weight 400 · letter-spacing −0.5

Postdrome tracks the 24–72 hours after a migraine — the fatigue, brain fog, residual photophobia, and mood disruption that exist in clinical literature but are ignored by every incumbent tracker. We claim that after-phase as our structural moat: the migraine that doesn't end when the headache does.

SF Pro / Inter · 16px · weight 400 · line-height 1.6

App icon

Three iOS-supported variants: light (default), dark (iOS dark mode), and tinted (iOS 18+ user-tinted appearance). All cropped to the iOS squircle (22.37% corner radius). The 1024 PNG is the App Store submission size; smaller PNGs are pre-generated for the home screen, Spotlight, Settings, and notification slots. JPG fallbacks (white background) are included for any context that rejects transparency.

Light — default

Dark — iOS dark mode

Tinted — iOS 18+ user-tinted

The tinted variant is grayscale (not transparent). iOS applies the user's chosen tint, with brighter regions receiving stronger saturation. Sky uses a 40% gray; ground and sun are pure white so they take the tint at full strength.

Wordmark

Horizontal lockup: line-art mark on the left, "postdrome" in lowercase Source Serif on the right. Eight color variants ship for transparent, on-paper, on-slate, and on-teal contexts.

primary · slate text · teal mark
wordmark-primary-on-paper-lg.png

mono slate · for monochrome use
wordmark-mono-slate-on-paper-lg.png

all teal · for editorial / playful use
wordmark-all-teal-on-paper-lg.png

paper on slate
wordmark-mono-paper-on-slate-lg.png

paper on teal
wordmark-mono-paper-on-teal-lg.png

Mark — standalone

When the wordmark won't fit (favicon, social avatar, watermark), use the mark alone. Two forms: the square version (full-bleed icon, no wordmark) and the horizontal line-art version (just the horizon + arc, no enclosing square). Use the square for app/profile contexts; use the horizontal for inline or letterhead use.

Usage

Do

Use lowercase "postdrome" everywhere — including marketing copy, App Store, social handles.
Pair the teal mark with slate text on paper backgrounds. This is the default.
Use the dark icon variant for any dark-mode product surface.
Use the SVG sources whenever the destination supports them (web, Figma, Sketch, in-app SF Symbols-style usage).
Maintain clear space around the wordmark equal to the cap height of the "p".
For monochrome contexts (faxes, single-color print, embroidery), use the slate-on-paper or paper-on-slate wordmark.

Don't

Don't use Title Case ("Postdrome") in marketing or UI copy. Lowercase only.
Don't recolor the half-sun. The amber is fixed.
Don't add gradients, shadows, or glows to any mark.
Don't place the wordmark on a busy photo or pattern. Use a solid brand color or white.
Don't stretch, rotate, or skew the mark or wordmark.
Don't pair the mark with a different typeface than Source Serif (the mark and wordmark are designed as a single unit).

File index

All assets are vector-primary (SVG), with PNG (transparent background) and JPG (white background flatten) fallbacks at multiple sizes.

postdrome/ ├── app-icon/ │ ├── icon-{light,dark,tinted}-{1024,180,167,152,120,87,80,60,58,40}.png # transparent corners │ ├── icon-{light,dark}-{...}.jpg # white-bg fallback │ └── icon-{light,dark,tinted}-1024.svg # vector source ├── wordmark/ │ ├── wordmark-{8 color variants}-{xl,lg,md,sm}.png # transparent │ ├── wordmark-{8 color variants}-{xl,lg,md,sm}.jpg # flattened │ └── wordmark-{6 color variants}.svg # vector source ├── mark/ │ ├── mark-square-{variant}-{1024,512,256,128,64}.png │ ├── mark-horizontal-{teal,slate,paper,amber}-{lg,md,sm}.png │ └── mark-horizontal-{color}.svg, mark-square-{variant}-1024.svg └── brand-sheet.html # this file

SVG sources reference Source Serif 4 with Charter, Iowan Old Style, and Georgia as fallbacks. The bundled PNG/JPG renders use Charter (an Apple-shipped serif visually compatible with Source Serif) since the rasterization environment doesn't have Source Serif installed. When you re-export the SVGs from a design tool with Source Serif installed, you'll get the canonical wordmark.