009Evergreen

Web app style · also good for website, report, desktop-app

Crisp white with a forest-green spine, dense regular-weight grotesk lists, and a mono capitals voice for every button and tag.

Use it: tell your agent

make my web app in 009
Style 009, Evergreen: app screen, 1440 wide preview
App screen, 1440 wide

The signature

Two voices: a plain, regular-weight grotesk for everything you read, and short Geist Mono capitals for everything you press or classify (buttons, column heads, state tags). The ink is deep forest green, not black. Fresh green is the one active colour, for the primary action and 'paid'. Lists are dense and ruled, and still very legible.

Credit

After Plain (plain.com): white product UI with one fresh green, dense lists, very legible. Our own re-making on fictional content, not affiliated. Visit plain.com

The preview is our own re-making in free fonts, with our own sample content. Nothing from the source is shown here.

Palette

  • paper#FFFFFF
  • forest#0A2414
  • black#000000
  • mutedrgba(10,36,20,0.65)
  • pale#F7FAF9
  • mint#F3FBE9
  • green#1AD379
  • green-text#13864E
  • pink#FFBAC3
  • maroon#360003
  • rulergba(10,36,20,0.09)

Fonts

  • DisplaySchibsted Grotesk400, 500
  • TextSchibsted Grotesk400, 500
  • MonoGeist Mono500

Sign in to see the full guide

The guide is the whole recipe for Evergreen: type sizes, colour roles, spacing, layout, components, and the rules your agent must never break. It is free with a DevThrottle account.