Data Infrastructure references

7 deeply-analysed data infrastructure sites, 4 flagship-tier. Each carries the design tokens, the do and don't rules, the signature moves and the section anatomy, so an AI builder grounds a data infrastructure brief in how the best sites actually build it (home, services, service detail, pricing, case study, testimonials, product, article).

Screenshot of Clickhouse

Clickhouse

flagship

Data Infrastructure

The reference for a near-black developer-tool homepage where one electric lime (#faff69) is the sole chromatic voice, carried only by the primary CTA and accents against an otherwise white-on-black monochrome.

Screenshot of Decodable

Decodable

strong

Data Infrastructure

The reference for B2B data-infrastructure: dark navy hero with rainbow data-flow visualization, Inter at four weights, bright Anthropic-blue CTAs over deep `#0e0f18`.

Screenshot of Liveblocks

Liveblocks

strong

Data Infrastructure

a pure-black developer-infrastructure site where Suisse + JetBrains Mono on stark `#000` carry the engineering authority, a single magenta-glow card with handwritten annotations sells the human side of collaboration, and 58 Radix-UI keyframes power dropdown / sheet / popover motion that feels app-grade rather than marketing-page-grade.

Screenshot of Neon

Neon

flagship

Data Infrastructure

The reference for a pure-black developer-tool hero where a single electric green (#34d59a) waveform of light carries all the energy against #000000, with a giant near-lightweight Inter headline and a hard tension between pill CTAs (9999px) and sharp 4px corners everywhere else.

Screenshot of Oxide Computer Company

Oxide Computer Company

flagship

Data Infrastructure

The reference for terminal-grade infrastructure design: a near-black #0b0e12 canvas with razor 1px hairlines, GT America Mono CLI labels, and one rationed phosphor green #00d892 used as an LED status signal rather than a marketing accent.

Screenshot of Planetscale

Planetscale

flagship

Data Infrastructure

The reference for a whole-page monospace developer tool: fixed-width ui-monospace type on off-white #fafafa, one ember-orange #f35815 action accent, and zero shadow so the site reads like a well-formatted README.

Screenshot of Segment

Segment

strong

Data Infrastructure

The reference for a developer-CDP brand migrating into its acquirer - Twilio red + Segment blue on deep navy, isometric red cube illustrations, Whitney SSm single-family discipline.

Back to the full collection