elevenlabs.io

Extracted 2 times•Last extracted 2 hours ago•Visit site ↗

Analyse Elevenlabs's design system — a palette of 12 colours including #FDFCFC, #FF4704, and #F5F3F1 and Inter and WaldenburgFH typography. Download the ready-made Tailwind config, Figma variables, shadcn/ui theme, React theme, W3C design tokens, and CSS custom properties, and drop them into your own project in minutes. Includes an AI-optimised design brief you can feed straight to Claude, Cursor, or any coding agent.

Colour palette

#FDFCFC

#FF4704

#F5F3F1

#0A59D2

#052F70

#0447FF

#F41A2F

#000000

#57534E

#777169

#A59F97

#E5E5E5

This is a short summary of the brand and most-used colours. The full download captures every colour extracted from the live DOM — usually 50–100 unique values, all named and tokenised across Tailwind, Figma, CSS variables and design tokens.

Typography

Font: Inter, WaldenburgFH, Geist Mono

Base size: 48

Scale: 48, 36, 32, 20, 18, 16

Downloads

Free preview

CSS variables + HTML report. Free, no signup.

⬇ Download free preview

Pro download

All 8 files

Tailwind · Figma · shadcn · tokens · React theme · AI brief

⬇ Download all 8 files — $3 or $10/month for unlimited →

What's included

Tailwind config — drop into tailwind.config.js
Figma variables — import directly into Figma
shadcn theme — paste into globals.css
React theme — Chakra / Stitches compatible
W3C design tokens — any token tooling
Full CSS variables
Visual HTML preview
AI-optimised design brief

Recent extractions

2 hours ago

5 hours ago — Mozelos