Copy Design — Inspect CSS & Tailwind

Inspect any element and copy clean CSS or Tailwind. Export a page's colors, fonts and spacing as design tokens.

Inspect any element on any website and copy production-ready CSS or Tailwind — buy once, no subscription. Copy Design gives developers and designers the fastest way to grab styles from a live page. WHAT IT DOES • Hover any element to see its size, display, font, colors, padding, margin, radius and shadow. • Click to lock a selection; use the arrow keys to walk the element tree. • Copy the element's CSS, HTML, Tailwind classes or a JSON snapshot. • Extract a whole page's design system: color palette, type scale, spacing, radii and shadows. • Export design tokens as CSS variables, a Tailwind config, or JSON. • Move the panel wherever you like, collapse it, and it remembers your layout. • Choose px or rem output, and your default copy format, in the options page. WHY COPY DESIGN • Buy once, own it forever — no monthly subscription. • 100% local and private: nothing is uploaded, no account required. • Works on every site — it reads whatever element you point at. • Clean, modern UI that stays out of your way. FREE • Element inspector • Copy CSS and HTML • Color swatches PRO (one-time) • Copy Tailwind classes • Copy JSON • Page palette extraction • Type scale extraction • Design-token export (CSS vars / Tailwind config / JSON) • Lifetime updates Perfect for front-end developers, designers, agencies and anyone rebuilding or matching a UI. Privacy policy: https://copy-design.netlify.app/privacy.html