Chrome extension

Peel any UI off the web

Point at any button, card, nav bar, or layout on a live site. Peel captures computed styles and copies Tailwind v4, JSX, or plain CSS to your clipboard.

Install Peel UI on Chrome →See how it works

Peel UI — peel any UI off the web, click any element, copy Tailwind or CSS

The problem

You see a component you love. You open DevTools. You click through computed styles, copy hex codes, guess at spacing, rebuild from a screenshot. Twenty minutes later you have a rough approximation, not the real thing.

Peel UI skips that loop. Hover the element, click, paste. Production-ready output.

How it works

Turn on the picker — click the Peel icon or press Alt+Shift+P (⌘+Shift+P on Mac).
Hover and click any element. A live cyan outline shows exactly what you will capture.
Copy instantly — Tailwind className strings, JSX markup, or inline CSS.

Navigate nested DOM with ↑ (parent) and ↓ (first child). Esc exits picker mode. Enter copies the current selection.

How Peel UI picker works — hover, click, copy in three steps — Hover, click, copy in three steps

What you get

Peel UI hero — peel any UI off the web, copy Tailwind or CSS — Peel any UI element off the web

Tailwind v4, mapped for you

Peel reads computed CSS and maps it against bundled Tailwind v4 defaults. Values on the scale become clean utilities (p-4, text-neutral-500). Off-scale values become arbitrary classes (w-[15px]).

Three export formats

Format	Output
Tailwind	Utility classes per element
JSX	Same classes as className, clean markup
Plain CSS	Computed inline styles plus CSS block

Smart DOM cleanup

Exports strip broken aria-* refs, empty wrappers, and aspect-ratio spacers. Inline SVGs become size-tagged placeholders.

Zip bundle for assets

When your selection includes icons or images, hold Shift while copying to download SVGs, images, and JSX icon components in peel-ui-export-YYYYMMDD-HHMM.zip.

Tailwind v4 and Plain CSS export formats — Tailwind v4 or plain CSS

Production-ready Tailwind classes — Paste. Ship. Done.

Brand

Neon magenta, electric cyan, sticker-peel metaphor — built to read at toolbar size and on store tiles.

Brand guide: palette, typography, components

Peel UI Chrome Web Store small promo tile — Store promo tile (440×280)

Keyboard shortcuts

Action	Windows / Linux	Mac
Toggle picker	`Alt+Shift+P`	`⌘+Shift+P`
Copy selection	`Enter`	`Enter`
Zip + copy	`Shift + click / Enter`	`Shift + click / Enter`
Move to parent	`↑`	`↑`
Move to first child	`↓`	`↓`
Exit picker	`Esc`	`Esc`

Who it's for

Frontend devs, design engineers, and anyone prototyping in Tailwind who sees a component in the wild and thinks I want that.

Install

Peel UI is free.

Install from the Chrome Web Store.
Pin the extension to your toolbar.
Open any normal web page (not chrome:// or the Web Store).
Click Peel UI, turn on the picker, hover and click.

Peel runs only when you activate it. Nothing is sent to a server.

Requirements: Chrome 116 or later.

Install Peel UI on Chrome →

Peel UI app icon — install from Chrome Web Store

Support

Something isn't working

Picker won't start — restricted pages (chrome://, Web Store, file://) are blocked. Use a normal https site.
Wrong element — use ↑ and ↓ before copying.
Classes look off — Peel maps to Tailwind v4 defaults, not your repo theme.
Zip didn't download — Shift+copy needs SVGs or images in the selection.

Contact

Email me@il.ly or @illyism.

FAQ

Is Peel UI free?: Yes. Install and use it at no cost.
Does Peel read my project's Tailwind config?: No. Peel maps to bundled Tailwind v4 default tokens only.
Does Peel send my data anywhere?: No. Exports are generated locally. Stats stay in chrome.storage.local on your device.
Can I use exports commercially?: You're responsible for respecting the original site's terms and licenses.
Why arbitrary classes like text-[15px]?: Peel preserves exact pixel values when no default token matches.
Does Peel work on iframes?: Cross-origin iframe content is not accessible due to browser security.
Tailwind vs CSS export?: Tailwind gives utility strings. CSS gives computed inline styles plus a stylesheet block.

Privacy

Peel UI runs on your machine. It does not collect browsing history.

What Peel accesses

When you activate the picker, Peel injects scripts into the active tab to read DOM and computed CSS. Shift+copy may fetch image URLs from the page for zip bundles. Peel does not transmit exports to external servers.

Permissions

Permission	Why
activeTab	Access the tab where you activate Peel
scripting	Inject the picker when you turn it on
contextMenus	Peel this element right-click action
storage	Save preferences and local stats
downloads	Save zip bundles on Shift+copy
offscreen	Build zip archives in a background document

Privacy questions: me@il.ly. Last updated August 2026.

Peel UI

Copy UI as Tailwind. Playful, tactile, dev-friendly.

Install Peel UI on Chrome →