Brand assets · v1

The pieces that make it look like me.

Logo marks, colors and type for anything carrying my name. Please use them as they are. Don't recolor, stretch, rotate or add effects. For other formats, email me.

01 — LOGO

The mark

An L with a Blaze full stop. Use the teal tile by default, the ink tile on photos or dark layouts, and the cream tile on teal.

Teal mark
TealPrimary · light backgrounds
Ink mark
InkPhotos · dark layouts
Cream mark
CreamOn teal or ink
Libby Fidel
Libby Fidel

Do

  • Leave clear space around the mark of at least half its width
  • Keep it 24px or larger on screen
  • Set the wordmark in Fraunces Regular

Don't

  • Recolor the tile or the Blaze dot
  • Stretch, rotate, outline or add shadows
  • Put it on busy photos without the ink tile
02 — COLOR

Palette & proportions

Warm neutrals make up half of any page, teal carries the brand, and the highlights are used sparingly so they stay loud.

Cream
Linen
Ink
Deep teal
Seafoam
50% Neutrals40% Brand teals10% Highlights

Neutrals

≈ 50% of any page
Cream
Page background
251, 247, 240
Linen
Cards, alt sections
241, 235, 225
Stone
Borders, dividers
221, 213, 200
Pebble
Disabled, text on ink
185, 177, 164
Slate
Secondary text
92, 102, 100
Ink
Body text, footer
19, 41, 44

Brand teals

≈ 40%
Deep teal
Hero blocks, links, primary brand color
0, 109, 119
Seafoam
Accents on teal or ink, tags, illustration
131, 197, 190

Highlights

≈ 10% or less
Blaze
Primary buttons, the full stop in the mark. One per screen.
255, 91, 20
Butter
Emphasis words on teal or ink, highlights
255, 222, 122

Click a hex value to copy it.

Approved pairings

WCAG contrast
AaInk on Cream · 14.2 : 1
AaCream on Deep teal · 5.7 : 1
AaButter on Deep teal · 4.6 : 1
AaSeafoam on Ink · 7.7 : 1
AaInk on Blaze · 4.9 : 1
AaInk on Butter · 11.6 : 1
AaDeep teal on Cream · 5.7 : 1
AaSlate on Cream · 5.6 : 1

Blaze is too light for white or cream text (2.9 : 1), so Blaze buttons always use Ink labels, and Blaze is never used for body text on light backgrounds.

03 — TYPOGRAPHY

Typefaces

Three free families from Google Fonts: a warm serif for headlines, a clean sans for reading, and a mono for labels and data.

FrauncesDisplay & headlines · Regular 400, Semibold 600Google Fonts ↗
Conviction starts on slide two.
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
DM SansBody & UI · Regular 400, Medium 500, Bold 700Google Fonts ↗
Body copy is set in DM Sans at 17–18px with generous line height, so long essays stay easy to read.
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789
JetBrains MonoEyebrows, labels, hex codes · Regular 400Google Fonts ↗
LATEST ESSAY · 6 MIN READ · #006D77
Type scaleSizes for web
H1 · 56 / 1.05Headline
H2 · 34 / 1.15Section title
H3 · 22 / 1.3Card title
Body · 18 / 1.6The quick brown fox jumps over the lazy dog.
Small · 14 / 1.5Captions and metadata
Label · 12 monoEyebrow label
04 — IN USE

Putting it together

A teal block for the headline, cream and linen for everything else, one Blaze button.

Latest essay · 6 min read

Most seed decks answer the wrong question

StatCard on Linen
StatTeal number, Slate label
StatFraunces numerals