Restyle Any Tailwind Site Live — Before You Touch the Code
Styles Gallery tries 127 palettes, 102 font pairings and 83 design styles on your real running site — one click in Chrome, no rebuild. All of it free. Pro hands the direction you picked to your AI as exact tokens — hours of manual tweaking you never do — and pins it so a reload never puts the site back.
The gallery is free forever — no account, no install.
Game-changer for rapid prototyping and styling.
Being able to test and preview themes live on my actual website before committing to a direction is amazing.
Once I find a look I like, copying the AI prompt to make the changes takes all the guesswork out of implementation.
It's seamlessly fit into my build process and saved me hours of manual tweaks during development.
highly recommend!
Design knowledge you can see
Styles, palettes, pairings and easings usually live as words in a doc. The gallery renders them as things you can compare, copy and try on.
83 design styles
One identical mini landing page, re-skinned 83 ways — the differences ARE the styles.
127 color palettes
Each palette worn by a full mock page, not swatch strips — see the six colors working together.
102 font pairings
Real type specimens with live weights, loaded from Google Fonts.
Motion lab
Every easing curve replayed on a real toast — hover to feel the difference.
From “which style?” to seeing it live
Browse the gallery
Free, no account. Compare styles, pin candidates, build a brief.
Wear it on your site
One click in the extension popup applies palette, type, style and motion to the real running page.
Pin it and iterate
Pro pins your picks to the project — they survive every reload while you show teammates and decide.
What the extension does
All 83 design directions, on your own site
The full styles.json vocabulary — every gallery flavour projected into tokens and worn by the site you are actually building. Free, all of it, no account needed.
127 palettes, applied live
Every palette from the gallery, translated onto your site's own shadcn variables — buttons, cards, borders, dark mode, all at once.
102 font pairings, plus every Google font
Real Google Fonts, loaded past any CSP, routed heading/body/mono the way your site already splits them.
Motion & radius knobs, and the CSS to copy
Easing curves, tempo and the whole border-radius ladder — nudge one dimension without touching the rest, then copy the CSS we painted on the page.
The AI prompt for any directionPRO
The direction in its own words, the exact tokens for Tailwind v4 + shadcn or plain CSS, the effects tokens can't carry, and the poster to match. Paste it into Claude, Cursor or v0 and the restyle lands in your codebase.
Pin every site — picks survive every reloadPRO
A free account pins one site. Pro pins them all: your picks re-apply on every navigation, on every origin you've enabled.
Stop imagining redesigns. Watch them.
Free forever for the gallery and for trying every style on your own site. Pro hands it to your AI and makes it stick. 14-day refund on your first payment — no questions asked.