Lightdash

A developer-first, open-source BI marketing surface built on a pure white canvas with near-black ink and a single electric-violet brand accent (#625df5) that appears mostly as decorative pixel-mosaic artwork. The system reads as precise, technical, and confident — oversized Britti Sans display headlines with very tight leading, pill-shaped buttons, soft multi-layer drop-shadowed product mockup cards, and integration logos in their native brand colors. Voltage comes from the giant condensed headlines and real product UI (dashboards, SQL/CLI panels) shown directly inside cards rather than from heavy color use.

lightdash.com

Works with Claude Code·Cursor·Codex·Gemini CLI·Copilot·v0·Lovable·Bolt·Windsurf·Replit

↓ .md ↓ All files

loading…

Color Palette

Accent

Neutrals

Typography

display-xl 76px · 600 · 0.9

The quick brown fox jumps

display-lg 57px · 600 · 0.95

The quick brown fox jumps

heading 32px · 400 · 1.25

The quick brown fox jumps

body 16px · 400 · 2.0

The quick brown fox jumps

Spacing & Shape

Spacing

Name	Value	Preview
xxs	4px
xs	8px
sm	10px
md	12px
lg	16px
xl	20px
xxl	24px
xxxl	28px

Border Radius

Name	Value	Preview
xs	2px
sm	6px
md	8px
lg	12px
xl	16px
xxl	26px
huge	80px
pill	999px

FAQ

What colors does Lightdash use?: Lightdash's core palette includes #000000, #222326, #272835, #36394a, #666d80. The full color set with usage roles (canvas, ink, surfaces, accent, semantic) is documented in the Lightdash DESIGN.md.
What font does Lightdash use?: Lightdash's primary typeface is Britti Sans. The complete type scale (sizes, weights, line-height and letter-spacing per role), with an open substitute where the original is licensed, is documented in the DESIGN.md.
What is the Lightdash design system?: A developer-first, open-source BI marketing surface built on a pure white canvas with near-black ink and a single electric-violet brand accent (#625df5) that appears mostly as decorative pixel-mosaic…

More like this

↓ .md ↓ All files

loading…