Skip to content
StyleLift

CSS inspector extension for Chrome, Edge and Safari

Copy clean CSS from any website.

Hover any element on any website to see its clean CSS, with its hover states, breakpoints and variables. Click to copy it. Shift-click copies the whole component as HTML + CSS that re-renders at the same size.

Free for 7 days, no card needed. $9 once for a lifetime license. All sales are final.

Try it on this page Coming soon to Chrome, Edge and Safari

Try it on this page.

StyleLift’s real CSS engine, running in your browser. Hover, click to copy, Shift-click for HTML + CSS.

Hover the sample site PINNED
Font and colors show here
/* The CSS of whatever you hover shows here. */
↑↓←→ walk · Esc unpinLive demo

With a keyboard: Tab to the sample site, then use the arrow keys to walk the DOM, C to copy CSS, H to copy HTML + CSS and Esc to unpin. On a touch screen: tap an element, then Copy CSS. The tour stops as soon as you take over.

How it works

Three steps, nothing to set up.

  1. Open it on any page

    Add the extension, then click the StyleLift button in your toolbar or press Alt Shift C. It runs on that tab only, and only when you ask.

  2. Hover to inspect

    The panel shows the element’s clean CSS, font and colors. Arrow keys walk up, down and across the DOM.

  3. Click to copy

    Click copies the CSS. Shift-click copies the whole component as HTML + CSS. The ⚙ button picks CSS, inline or JSX. Esc unpins, then closes StyleLift.

What you get

The CSS you’d have written yourself.

  • Output

    Only what matters

    Browser defaults removed, shorthands merged, colors in hex, rgb or hsl. No 300-line dump of computed styles.

  • Layout

    Authored values

    Widths and grid templates as written, so you get repeat(3, 1fr) rather than pixels, and margin: 0 auto for centered blocks. Cascade layers, nesting and container queries included.

  • States

    States and breakpoints

    The element’s :hover, :focus and :active rules come along, with its @media and @container variants, so the copy still reacts and stays responsive.

  • Variables

    Variables kept

    var(--brand) stays a variable, with its value in a comment beside it. Prefer plain values? One setting.

  • Formats

    CSS, inline or JSX

    Copy CSS rules, an inline style attribute or a React style object. Copy HTML + CSS follows the same choice.

  • Components

    Same size, anywhere

    Shift-click copies HTML + CSS, ::before and ::after included. Paste it into CodePen or your project and it re-renders at the same size.

  • Keyboard

    Walk the DOM

    Arrow keys move to the parent, a child or a sibling, so wrappers and containers are easy to reach. Esc unpins, then closes.

  • At a glance

    Fonts and colors

    The panel shows the font, size, weight, text color and background of whatever you hover, as it looks at rest.

  • Tricky pages

    Works where it counts

    On sites with a strict Content Security Policy, inside web components, above open modal dialogs, on pages with huge stylesheets, and on sites that block the clipboard.

Why StyleLift

Paid once, and clean output.

CSS inspectors tend to come in two kinds: a subscription, or a free tool. Here is how StyleLift compares on the things you notice when you use one.

StyleLift compared with subscription inspectors and free inspectors
Subscription inspectors Free inspectors StyleLift
What you pay A monthly or yearly fee, for as long as you use it Nothing Free for 7 days, no card needed. $9 once for a lifetime license. All sales are final.
Trying it first Often a short trial that needs a card, or no trial Nothing to try: it’s free 7 days with every feature, no card
Account Usually required Sometimes required None
What you copy Varies by tool Often every computed value, in pixels Clean CSS with authored values, states, breakpoints and variables, ready to paste
Whole components In some tools Rarely HTML + CSS that re-renders at the same size
Your data Read each privacy policy Read each privacy policy Stays in your browser, apart from a license check

Privacy and permissions

It only looks when you click.

Permissions
Only activeTab for page access, so the store shows no install warning. StyleLift sees a tab only after you click its button, and only that tab.
Account
None. No sign-up, no email address, no password.
Tracking
None. No analytics, no ads, no third-party code.
What leaves your browser
Nothing, except a license check with Lemon Squeezy, our payment provider, in Chrome and Edge. The Safari app sends nothing at all.
This website
No cookies, no analytics scripts, no third-party requests.

The details are in the privacy policy.

Pricing

Lifetime license

Chrome and Edge

Free for 7 days, no card needed. $9 once for a lifetime license. All sales are final.

Lifetime license: coming soon Try it on this page

All sales are final, so the trial comes first and asks for nothing: use every feature for 7 days before you decide. Payment is handled by Lemon Squeezy.

  • Every feature during the 7-day trial. No card needed.
  • After the trial, inspecting stays free. Copying needs the license.
  • One license works in up to 3 browsers.
  • No subscription and no account.

Using Safari on a Mac? StyleLift for Safari is a separate paid app on the Mac App Store, with every feature included. It doesn’t need a license.

Questions

FAQ

How does the free trial work?

Install StyleLift and every feature works for 7 days. There’s no card to enter, no account to create and nothing to cancel.

What happens when the trial ends?

Inspecting stays free: hover any element and read its CSS for as long as you like. Copying CSS and components needs a lifetime license. Nothing is charged automatically, because StyleLift never asked for a card.

What does “up to 3 browsers” mean?

One license activates StyleLift in up to 3 browsers, for example Chrome at work, Chrome at home and Edge on a laptop. To move it, deactivate a browser on StyleLift’s options page, then activate the new one.

Is there a Safari version?

Yes. StyleLift for Safari is a separate paid app on the Mac App Store, with every feature included. You buy it from Apple, so it doesn’t use a license key, and a Chrome or Edge license doesn’t cover it.

Does it work offline?

Yes. Inspecting and copying happen entirely in your browser. The only network request is the license check with Lemon Squeezy: once when you activate, then about once a week. If you’re offline, StyleLift keeps working and checks again later.

Which pages does it work on?

Any regular web page, including sites with a strict Content Security Policy, web components and pages with an open modal dialog. Browsers don’t let extensions run on their own pages, such as settings, extension stores and the built-in PDF viewer.

Can I use CSS I copy from other sites?

StyleLift is for learning how something was built, debugging, prototyping and rebuilding your own designs. The CSS and HTML you copy come from the sites you inspect, and StyleLift gives you no rights to them: learn from them and write your own, and check a site’s license or ask before reusing its code as it is. More in using copied CSS responsibly.

Can I change my mind after buying?

All sales are final. That’s why the trial comes first and asks for nothing: you get 7 days with every feature to make sure StyleLift fits the way you work before you pay. If something isn’t working, write to support@getstylelift.com and we’ll help.

Hover. Click. Pasted.

Free for 7 days, no card needed. $9 once for a lifetime license. All sales are final.

Try it on this page Coming soon to Chrome, Edge and Safari