Dembrandt vs Lighthouse
Lighthouse audits web quality. Dembrandt audits design tokens.
Lighthouse loads a URL and scores it across performance, accessibility, SEO, and best practices. Dembrandt loads the same URL and extracts every design token the browser renders — colors, typography, spacing, radius, shadows — then scores how much they drifted from the previous deploy. Same starting point, different audit.
Comparison
| Lighthouse | Dembrandt | |
|---|---|---|
| What it measures | Performance, accessibility, SEO, best practices | Design tokens: colors, typography, spacing, radius, shadows |
| Color contrast | WCAG contrast as part of accessibility score | Per-token WCAG AA and AAA grades with exact ratios |
| Token extraction | No token extraction | Full token set extracted from the live DOM |
| Drift detection | No baseline comparison or drift scoring | Numeric drift score per deploy against a pinned baseline |
| CI integration | Yes — lighthouse-ci, GitHub Actions | Yes — dembrandt CLI with --key flag |
| Brand regression | Not in scope | Core use case — flags when tokens shift between releases |
| Multi-site support | Run per URL, results not aggregated | One account, unlimited domains, single dashboard |
| Output | HTML report, JSON, scores 0–100 | JSON extraction, drift score, per-token breakdown |
What Lighthouse covers
- Page load performance: FCP, LCP, CLS, TBT
- Accessibility: missing alt text, low contrast elements, ARIA issues
- SEO: meta tags, canonical URLs, crawlability
- Best practices: HTTPS, console errors, image formats
What Dembrandt covers
- All computed color values with exact WCAG AA and AAA contrast ratios
- Typography: font families, sizes, weights, line heights by context
- Spacing system, border radius, box shadows
- Drift score vs baseline: what changed between this deploy and the last
Where they overlap
Both tools load a production URL and inspect what the browser renders. Lighthouse includes a contrast audit in its accessibility category: it flags elements where the text-to-background ratio fails WCAG AA and counts them toward the score.
Dembrandt extracts every color value on the page and computes AA and AAA grades per token, with exact hex values and contrast ratios. You see which specific color fails, not just how many elements do. Running both in CI covers web quality and design token drift as separate, complementary gates.
Run a one-off extraction on any URL with no account required:
npx dembrandt your-site.comTo enforce drift in CI, get an API key and add --key $DEMBRANDT_KEY to your deploy step. Full setup: cloud drift CI recipe.