Skip to content
Brittany Ellich
~ garden preview ~

A field guide to the field guide.

internal reference, not for the public →

Every primitive in the new system, in one place. If something on a real page does not match what is rendered here, the page is wrong, not the system.

~ tokens · type ~

Type scale.

six roles, two families →
display
Vollkorn 26/1.2/400
Everything I've harvested.
section-title
Atkinson 18/1.3/500
What I'm tending right now
body
Atkinson 14/1.6/400
The garden bed metaphor is the structure of this site. Three beds tended by one gardener. Plus a notebook.
kicker
Atkinson 11/1.4/400 caps +0.06em
~ the orchard ~
caption
Atkinson 11/1.5/400
page 1 of 19, 128 items in the orchard
voice
Vollkorn italic 11/1.4/400
not a CV, a body of work →
~ tokens · color ~

Palette.

cream paper, three garden beds, six page labels →

Paper & ink

paper
#FAF6EE
paper-edge
#D8C9A8
paper-edge-soft
#EFE5CF
ink
#2C2C2A
ink-soft
#5F5E5A
ink-quiet
#888780

orchard

orchard
#D85A30
orchard-deep
#4A1B0C
orchard-fill
#FAEEDA

seedling

seedling
#639922
seedling-deep
#173404
seedling-fill
#EAF3DE

plot

plot
#1D9E75
plot-deep
#04342C
plot-fill
#E1F5EE

Content-type badges

Blog postTalkPodcastVideoComic
~ pattern · kicker → h1 → voice ~

Page intros.

one per garden bed →
~ the orchard ~

Everything I've harvested.

a body of work →
~ the seedling tray ~

Notes still figuring themselves out.

most of these will change →
~ the community garden ~

Tending with other people.

we can just do things (together) →
~ pattern · chip group ~

Filter chips.

one active per group →
~ pattern · feed item ~

A short feed.

three columns, dashed dividers →
  • Apr 28 last week
    Blog post
    On tending an indie site, slowly

    How the redesign happened in fits and starts, and what changed when I stopped pretending it was a launch.

    #indieweb#writing
    7 min read
  • Apr 14
    Talk
    The Balanced Engineer (Cascadia JS 2026)

    A 30-minute talk on building a technical career that does not consume the rest of your life.

    #career#talks
    32 min
  • Mar 22
    Comic
    PRs in the wild

    Three panels about a review that went better than expected.

    #comics
    1 page
~ pattern · now block ~

A `/now` block.

two-column grid, one block shown →
in the workshop

What I'm building

  • Redesigning brittanyellich.com in the field-guide style
  • A new episode of Overcommitted on burnout
  • Tomato seedlings on the porch
  • Mentoring two engineers through their first conference talk
  • Reading: "The Overstory" by Richard Powers
~ pattern · inline link ~

Inline links.

underline color tracks the current section →

Default body copy with an inline link in the page's section accent. Hover thickens the underline; focus draws a 2px outline. Visited links stay the same color, never purple.

~ pattern · newsletter form ~

Newsletter form.

single input, no popup, no sticky bar →
~ pattern · empty state ~

Empty states.

one serif italic line, no illustration →

Nothing's grown here yet. Check back when the season turns.