Skip to content
Browse
Library

Shelby. Neon signage on cocoa leather.

  • Crypto
  • Dark theme
  • 10 colors
  • 4 typefaces

Shelby runs on a warm-cocoa dark canvas punctuated by electric hot-pink type — a brutalist-cute aesthetic that swaps the typical fintech dark-gray for an almost edible brown background and turns contrast into spectacle. Typography is the hero: oversized GT-Planar display weights at 59-95px with aggressively tight tracking, set center-aligned on full-bleed color blocks that flip between deep umber, hot pink, and pale rose. Components are flat and undecorated — no shadows, tiny 4-10px radii, monospaced uppercase micro-labels in ABCReproMono that float above headlines like product codes. The rhythm is theatrical: each section is a color field change, not a card grid.

Visit shelby.ashfall.studio
Screenshot of Shelby
Captured from shelby.ashfall.studio on October 11, 2026

Shelby design system

Shelby

Brand1

  • Signature accent — massive display headlines on dark sections, body links, icon strokes, tag fills, the dominant brand voice

Accent5

  • Deepest accent surface — section backgrounds that sit between the cocoa base and neon pink, creates tonal depth in the surface stack

  • Soft pink surface for cards, footer panels, and the lighter half of alternating section bands

  • Muted violet fill for decorative graphic elements, secondary illustration accent

  • Rare hot violet for standout card backgrounds — used sparingly to break the pink monotony

  • Red supporting accent for decorative details and low-frequency emphasis. Use as a supporting accent, not as a status color

Neutrals4

  • Primary page canvas, body text on light surfaces, large display type on pink fields

  • Muted warm gray for badge borders and hairline dividers — a lighter cocoa for subtle structural lines

  • Near-white lavender for button text and borders on dark surfaces, ghost-control labels

  • Light section canvas, button label text on dark fields, badge text

Try a pairing

Pick any two colors from the palette to check whether text stays readable on top.

Aa

Cocoa Husk on Neon Orchid

6.31 : 1 contrast

Background
Text
  • Body textPasses AA 4.5
  • Large textPasses AA 3
  • StrictFails AAA 7

More DESIGN.md files. Same web, different personalities.