Home
DESIGN.mdStar on GitHub

dbt

The open standard for modern, AI-ready data transformation — build, test, and document data models in SQL.

Models Tests Lineage Sources Snapshots dbt Cloud
Signature — Model Lineage (DAG)
jaffle_shop click a model to focus its lineage
source staging intermediate mart
8 models · 7 dependencies
Colors
Primary — dbt orange
orange#FE6703Brand, primary CTA, mark
orange-hover#E85D00Hover
navy#101828Ink, button text, dark page
pale-purple#F6F5FFLight page
Accent
purple#632FF5Links, secondary
purple-light#9C79FFIntermediate nodes
lime#D8FF33Highlight, fresh data
yellow#FFCC25Warnings, callouts
Node types — lineage
source#23C05CRaw sources
staging#6B9AFFstg_ models
intermediate#9C79FFint_ models
mart#FE6703fct_ / dim_ models
Neutrals
grey#4A5060Secondary text
muted#8F8F9CMetadata
border#E5E7EBBorders, dividers
white#FFFFFFCards, surfaces
Typography — Polymath (≈ Space Grotesk) · Inter · IBM Plex Mono
display
Space Grotesk · 700
dbt
54px700
h1
Space Grotesk · 700
AI-ready data transformation
32px700
h2
Space Grotesk · 600
Deliver trusted data with dbt
22px600
body-lg
Inter · 400
The open standard for modern data transformation.
17px400
body-sm
Inter · 400
Build, test, and document models in SQL.
13px400
mono
IBM Plex Mono · 500
select * from {{ ref('stg_orders') }}
12pxmono
Components
Buttons
Model status
PASS ERROR fresh mart test
dbt CLI
Radius
6px
8px
12px
Guardrails
DO
Use dbt orange #FE6703 for primary actions, the mark, and focused lineage
Put navy text on orange buttons — orange is too bright for white
Color DAG nodes by type: source-green, staging-blue, intermediate-purple, mart-orange
Set headings in Polymath (≈ Space Grotesk), model names / SQL in IBM Plex Mono
Use purple and lime as accents — the dbt energy without competing with orange
DON'T
Put white text on the orange button — contrast fails; use navy #101828
Use purple or lime as the primary action — orange owns "go"
Set model names or SQL in a sans — dbt is code-first; mono everywhere
Tint dark surfaces neutral-grey — dbt's dark is navy #101828
Fabricate a DAG — use real dbt naming (stg_, int_, fct_, dim_)