Library

Design systems, measured from the source.

79 references read out of live production CSS — never estimated from a screenshot. Drop a DESIGN.md into a project and point your agent at it.


AI & LLM Platforms

A warm-canvas editorial interface for Anthropic's Claude product.

25 colors · 14 type steps · 29 components

Cohere's 2026 web system is a controlled enterprise AI interface built from stark white editorial space, deep green-black product bands, soft mineral surfaces, rounded media cards, and a distinctive type split between monospaced-feeling display headlines and precise Unica77 UI text.

23 colors · 12 type steps · 14 components

DeepMind

Visit site

A monochrome research interface where colour is content, never chrome.

27 colors · 14 type steps · 12 components

ElevenLabs

Visit site

A voice-AI brand whose marketing surfaces read like a quietly editorial print magazine.

27 colors · 14 type steps · 20 components

Minimax

Visit site

MiniMax presents itself as a premium AI infrastructure brand through a striking duality — bold black-pill CTAs and stark white canvas for marketing, paired with vibrant gradient product cards (orange-red, magenta-pink, purple, blue) that turn each model release into a distinctive visual identity.

28 colors · 15 type steps · 44 components

Mistral AI

Visit site

Mistral AI brands itself with a singular signature — atmospheric sunset gradients (mustard, orange, deep red) layered over photography of mountains, plus a horizontal "sunset stripe" bar that closes every page.

36 colors · 19 type steps · 42 components

| An almost defiantly minimal documentation-first system that treats the home page like a Markdown README — paper-white canvas, 36px center-aligned heading, a single black pill CTA, an inline terminal install snippet, and a hand-drawn llama mascot as the only ornamental element.

21 colors · 13 type steps · 22 components

OpenCode AI

Visit site

| A terminal-native marketing system rendered entirely in Berkeley Mono — every word on the page, from the hero headline down to the footer fine print, is monospaced.

28 colors · 8 type steps · 21 components

Replicate

Visit site

| Replicate's marketing surfaces pair the warm-cream developer-tools aesthetic of an indie ML playground with a confident hot-orange brand accent and a signature display typeface (rb-freigeist-neue) sized aggressively large at 72px+.

26 colors · 17 type steps · 20 components

AI creative-tools platform with an editorial film-festival aesthetic — cinematic dark heroes, paper-white reading bands, single proprietary sans, and pure black pill CTAs.

16 colors

Together AI

Visit site

An inspired interpretation of Together AI's design language — an AI infrastructure platform whose surface alternates between near-black hero bands (with a three-color orange-magenta-periwinkle gradient as the single piece of brand chrome) and bright white research / pricing / docs bands, knit together by a custom display sans and an uppercase mono eyebrow face.

13 colors · 14 type steps · 35 components

VoltAgent

Visit site

An inspired interpretation of Voltagent's design language — a developer-focused AI agent engineering platform whose surface is an unrelenting near-black canvas broken only by a single electric-green brand accent, code-editor mockups inside the hero, and a precise grid of dark feature cards that read like a documentation site dressed as marketing.

13 colors · 16 type steps · 25 components

An inspired interpretation of xAI's design language — Elon Musk's frontier-AI company whose web surface is a strict near-black canvas broken only by white pill outlines, occasional warm sunset / dusk gradient accents, a custom geometric sans (Universal Sans) for display, and an uppercase tracked monospace caption face; the whole system reads as engineered-cosmic, unmarketed.

18 colors · 11 type steps · 23 components

Automotive

BMW's corporate site — distinct from BMW M's motorsport-bombastic variant, this is a measured and settled corporate-automotive interface.

25 colors · 13 type steps · 26 components

A motorsport-engineering interface anchored on a near-black canvas with white BMW Type Next Latin display headlines in confident UPPERCASE.

21 colors · 13 type steps · 21 components

Bugatti

Visit site

An austere luxury-automotive interface that uses near-pure black canvas, white uppercase letterspaced display, and full-bleed automotive photography as the only voltage.

18 colors · 12 type steps · 17 components

Ferrari

Visit site

A luxury-automotive brand whose marketing surfaces read as cinematic editorial.

26 colors · 13 type steps · 24 components

Renault

Visit site

| Renault's web presence pairs the freshly-modernised Renault diamond (the 2021 flat-line rhombus mark) with a stark black-and-white canvas, a signature Sunlight Yellow accent, and the proprietary NouvelR display typeface.

25 colors · 15 type steps · 19 components

Backend, Database & DevOps

ClickHouse

Visit site

A high-performance database interface anchored on near-pure black canvas with electric yellow as the brand voltage.

24 colors · 15 type steps · 27 components

Composio

Visit site

A developer-tools brand for AI-agent tool integration whose marketing surfaces lean into a dark, technical aesthetic with a single deep-electric-blue voltage (`#0007cd`).

22 colors · 14 type steps · 21 components

HashiCorp

Visit site

An enterprise-infrastructure marketing canvas built around a near-black ground (#000000) and a system of per-product accent colors — Terraform purple, Vault yellow, Consul pink, Waypoint cyan, Vagrant blue — that act as identity tokens rather than decorative palette.

30 colors · 12 type steps · 22 components

MongoDB

Visit site

MongoDB carries a strong dual-mode visual identity — dark deep-teal hero bands with bright MongoDB green ({colors.

34 colors · 18 type steps · 44 components

PostHog

Visit site

| A playful developer-tools system rendered on a warm cream canvas with hand-drawn hedgehog mascots dotted across every page like marginalia in a sketchbook.

29 colors · 20 type steps · 30 components

Headless content platform with a dark-first editorial marketing surface — 112px display type, IBM Plex Mono technical eyebrows, and a single coral-red accent reserved for the highest-priority CTA.

16 colors

An inspired interpretation of Sentry's design language — a developer-tools brand built on a deep purple-violet midnight canvas, electric lime accents, and a slightly subversive illustrated personality.

21 colors · 16 type steps · 21 components

Supabase

Visit site

An inspired interpretation of Supabase's design language — an open-source database platform built on a clean white-and-near-black system with a single signature emerald-green CTA, a custom humanist sans display tier, and dense product UI mockups composited above the hero.

27 colors · 12 type steps · 16 components

Consulting & Professional Services

Boston Consulting Group's web system is a quiet editorial canvas — white ground, light-weight serif headlines in a deep midnight green, light-weight sans body copy with zero letter-spacing — punctuated by exactly one loud element: a lime-green pill button that carries every call to action.

30 colors · 19 type steps · 23 components

Design & Creative Tools

Airtable

Visit site

A sober, editorial workflow-software interface anchored on white canvas and dark-ink type, where brand voltage comes from full-bleed signature cards in coral, dark green, peach, and dark navy that punctuate long-scroll explainer pages.

28 colors · 14 type steps · 26 components

A vibrant claymation-meets-data interface for Clay.

29 colors · 13 type steps · 28 components

A confident black-and-white editorial frame interrupted by oversized, hand-cut pastel color blocks.

20 colors · 12 type steps · 23 components

A confident dark-canvas builder marketing site that treats the page like a working artboard — pure black surfaces, white display type set in GT Walsheim Medium with aggressive negative tracking, and a single confident blue (#0099ff) reserved for hyperlinks and selection states.

17 colors · 12 type steps · 21 components

Miro presents itself as the AI-powered visual workspace through a confident, almost playful brand voice — anchored by its signature canary yellow ({colors.

40 colors · 18 type steps · 48 components

Webflow

Visit site

An inspired interpretation of Webflow's design language — a visual web development platform whose surface contrasts a deep near-black `#080808` primary against a generous white canvas, broken by a five-stop chromatic accent system (purple / pink / blue / orange / green) that maps to the brand's product categories, and anchored by the proprietary WF Visual Sans family used at restrained 500 / 600 weights with negative tracking.

19 colors · 16 type steps · 31 components

Developer Tools & IDEs

An AI-first code editor whose marketing site reads like a quietly-confident developer-tools brand with a warm-cream editorial canvas (`#f7f7f4`) instead of the typical dark IDE atmosphere.

22 colors · 14 type steps · 25 components

A React Native developer-platform whose marketing site reads like a quietly-confident infrastructure brand.

28 colors · 14 type steps · 22 components

Raycast

Visit site

| Raycast's marketing system reads like an extended product screenshot.

31 colors · 15 type steps · 28 components

Superhuman

Visit site

An inspired interpretation of Superhuman's design language — a fast-email productivity brand split between an editorial dark hero (deep indigo navy with violet-sky atmospheric backdrop and a portrait subject) and a quiet white content body with off-warm-grey ink.

15 colors · 12 type steps · 16 components

An inspired interpretation of Vercel's design language — a developer-platform brand whose surface is a stark black-and-ink duet on near-white canvas, broken at hero scale by a multi-color mesh gradient (cyan / blue / magenta / amber) that acts as the entire decorative system, paired with a custom geometric sans for headlines and a monospaced caption face for technical labels.

36 colors · 14 type steps · 40 components

An inspired interpretation of Warp's design language — an agentic terminal-and-development-environment brand whose surface is a warm near-charcoal canvas (a tint warmer than pure black), broken only by clean Inter typography, the occasional Instrument Serif italic moment, and dense terminal-mockup imagery; CTAs are unusually understated, with shape geometry running tighter than most marketing sites.

9 colors · 14 type steps · 26 components

E-commerce & Retail

A warm, generous consumer marketplace anchored on a clean white canvas and Airbnb Rausch (#ff385c), the single brand voltage that carries every primary CTA, search-button orb, and rating dot.

23 colors · 18 type steps · 33 components

Meta's design system spans hardware commerce (Quest VR, Ray-Ban Meta AI glasses) and brand surfaces with a confident product-merchandising voice.

27 colors · 15 type steps · 38 components

| A photography-first commerce system built on extreme typographic contrast — towering uppercase Futura display lockups burned into editorial campaign imagery, sitting above a dense, neutral, near-monochrome retail chrome of pill-shaped black CTAs, gray search and tag pills, and tight 8px-grid product cards.

23 colors · 13 type steps · 24 components

Shopify

Visit site

An inspired interpretation of Shopify's design language — a cinematic commerce platform that runs two parallel design tracks.

22 colors · 15 type steps · 18 components

Fintech & Crypto

Binance

Visit site

A confident financial-platform interface anchored on a deep near-black canvas, where Binance's iconic yellow (#FCD535) carries every primary CTA, brand accent, and value-claim moment.

24 colors · 15 type steps · 35 components

Coinbase

Visit site

An institutional-grade crypto exchange whose marketing surfaces read like a quietly-confident financial-services brand.

22 colors · 16 type steps · 28 components

getquin

Visit site

A product design system wearing a marketing site.

58 colors · 12 type steps · 11 components

Revolut

Visit site

| Revolut's marketing surfaces pair a stark black canvas with the brand's cobalt-violet (`#494fdf`) and a wide accent palette of deep, fully-saturated product colours — teal, light-blue, deep pink, light-green, warning orange.

35 colors · 16 type steps · 21 components

An inspired interpretation of Stripe's design language — a financial-infrastructure brand built on a deep navy ink, an electric indigo primary, and a recurring atmospheric gradient mesh that occupies the upper third of nearly every marketing page.

20 colors · 15 type steps · 15 components

TradingView

Visit site

A financial platform that runs two design registers from one token set.

35 colors · 12 type steps · 11 components

Wealthsimple

Visit site

A money brand that behaves like a magazine.

34 colors · 12 type steps · 11 components

An inspired interpretation of Wise's design language — a global money-transfer brand whose surface combines an unusually heavy near-black display sans (weight 900 at 64–126 px) with a vivid lime-green brand accent, sage-tinted surface neutrals, and rounded white cards on a pale green-tinted canvas; the whole system reads more like a Scandinavian fintech magazine than a bank.

22 colors · 14 type steps · 28 components

Media & Consumer Tech

A photography-first interface that turns marketing into a museum gallery.

22 colors · 16 type steps · 24 components

An inspired interpretation of HP's design language — a white-paper enterprise-consumer system anchored by HP Electric Blue (`#024ad8`) as the lone signal CTA, near-black ink (`#1a1a1a`) for headlines, geometric Forma-DJR sans throughout, and angular blue-chevron decorations that nod to the HP wordmark's slashes.

28 colors · 16 type steps · 31 components

An enterprise-marketing canvas faithful to Carbon Design System: white surfaces, charcoal type, IBM Blue (#0f62fe) as the single confident accent, and a deliberately flat-square aesthetic where corners stay at 0–4px.

21 colors · 13 type steps · 22 components

| An engineering-grade marketing system organized around two surface modes — a deep black canvas for hero and footer chapters and a flat paper-white canvas for body content — connected by a single, almost violently saturated NVIDIA Green accent that carries every CTA, every active tab, and the small decorative corner squares that mark out cards.

28 colors · 18 type steps · 25 components

Pinterest

Visit site

| A photography-first discovery system organized around the Pinterest Red CTA, the masonry pin grid, and a soft warm-cream chrome that gets out of the imagery's way.

31 colors · 14 type steps · 25 components

PlayStation

Visit site

| A three-surface marketing system organized around alternating black, white, and PlayStation Blue chapters that scroll past the viewer like a console launch trailer.

36 colors · 14 type steps · 29 components

An inspired interpretation of Spasex's design language — a mission-oriented aerospace brand built on pure black canvas, full-bleed photographic and video heroes of rockets and Mars landscapes, and uppercase D-DIN display type set in tight vertical leading.

13 colors · 8 type steps · 10 components

An inspired interpretation of Uber's design language — a transportation-and-delivery super-app brand whose web surface is a black-and-white duet, framed by a custom geometric display sans, accented by a single signature pill shape (radius 999px) on every interactive element, and decorated only by editorial 4:3 illustrations of riders, drivers, and city objects.

13 colors · 13 type steps · 39 components

Vodafone

Visit site

An inspired interpretation of Vodafone's design language — a telecom super-brand whose web surface alternates between editorial photography hero bands with massive uppercase display headlines and clean white content bands, anchored by the company's signature scarlet red CTA and the proprietary Vodafone display sans set at impossibly heavy 800 weight.

8 colors · 17 type steps · 26 components

An inspired interpretation of Wired's design language — a flagship technology-magazine brand whose surface is a strict editorial duet of stark black wordmark on white canvas, anchored by a tall narrow custom display serif for hero headlines, a humanist serif body face for long-form reading, and a clean sans face for metadata; layout reads like a printed magazine ported to the web with very little marketing chrome.

9 colors · 14 type steps · 25 components

Productivity & SaaS

Cal.com

Visit site

A clean, calendar-software-first interface anchored on white canvas with black primary CTAs and custom Cal Sans display typography.

26 colors · 13 type steps · 26 components

Intercom

Visit site

An editorial customer-service marketing canvas built around a soft cream-white ground, charcoal type set in Saans (Intercom's proprietary geometric sans), and a single confident Fin Orange (#ff5600) reserved for the Fin AI brand.

25 colors · 13 type steps · 20 components

A dark-only product interface where separation is drawn with light rather than shadow — every raised surface is an inset white hairline at three to five percent.

39 colors · 17 type steps · 10 components

Mintlify

Visit site

Mintlify presents documentation infrastructure with a dual-mode aesthetic — atmospheric sky-gradient marketing heroes (cloud illustration backdrops, soft cream-to-blue washes) paired with dense developer-grade documentation surfaces.

32 colors · 20 type steps · 51 components

Notion presents itself as the all-in-one workspace through a confident, illustration-rich brand voice — anchored by a deep navy hero band ({colors.

47 colors · 17 type steps · 50 components

| Resend's marketing surfaces sit on a near-pure black canvas with off-white text and a single signature color — the deep editorial-serif Domaine Display headline mark — that gives an otherwise utilitarian developer-tool brand its print-magazine confidence.

28 colors · 14 type steps · 19 components

An inspired interpretation of Slacc's design language — a workplace messaging brand built on a deep aubergine primary, with cream-lavender hero gradients, blue inline links, and pill CTAs.

19 colors · 15 type steps · 16 components

An inspired interpretation of Zapier's design language — a workflow-automation platform whose surface combines warm-cream neutrals (`#fffefb` canvas, `#f8f4f0` soft cream) with deep coffee ink (`#201515`) and a single saturated orange CTA accent (`#ff4f00`); typography pairs the proprietary Degular Display family at hero scale with Inter for sub-displays and body, giving the brand a confident-warm rather than cool-tech voice.

10 colors · 16 type steps · 29 components

Retro Web

Dell (1996)

Visit site

An inspired interpretation of Dell.

17 colors · 10 type steps · 33 components

Nintendo.com (2001)

Visit site

An analysis of Nintendo.

22 colors · 7 type steps · 41 components