UIBrief: Copy any UI as Tailwind, CSS & AI prompt
Unknown author · Developer Tools
Media
5 items
Description
Hover any element to copy clean CSS and Tailwind v4, free. Pro: whole components, design tokens and AI-ready briefs. No account. UIBrief turns any interface you see on the web into code and context for your AI coding agent. Clean CSS and Tailwind v4 are free. Hover any element, click it, and get: • Clean CSS: only what the author wrote, without browser defaults or inherited noise • Tailwind CSS v4 classes, mapped to the default scale and palette (exact arbitrary values when nothing matches) • HTML and JSX: the whole component with Tailwind classes, ready for React • Design tokens: the page's palette, fonts, type scale, radii, shadows and spacing as CSS variables, a Tailwind v4 @theme block or JSON • Copy for AI: a markdown brief with markup, styles and tokens for Claude Code, Cursor or v0, plus a PNG screenshot of the element Why UIBrief • Local: it runs only on the tab where you click it. Nothing you inspect leaves your browser. • No account, no analytics, no tracking. • Keyboard first: ↑/↓ parent and child, ←/→ tabs, C to copy, Esc to exit. Shortcut: Alt+Shift+C. • Minimal permissions: activeTab, scripting and storage. No access to your browsing history. Free and Pro • Free forever: unlimited inspection, clean CSS and Tailwind v4 classes of any element. • Pro: whole components as HTML/JSX, design tokens, PNG screenshots and Copy for AI. • Every install starts with a 7-day Pro trial. No card, no account. • Pro is a one-time license, USD 5, with a 14-day refund. No subscription. Please respect other people's work: use UIBrief to learn, prototype and rebuild your own interfaces. Don't copy logos, brand assets or protected designs. UIBrief does not work on chrome:// pages, the Chrome Web Store or PDF files (browsers block extensions there).