NudgeCSS

Click any element on any website to edit its CSS visually — no code required.

NudgeCSS turns any webpage into a live design canvas. Click any element, and a clean side panel opens with full control over typography, spacing, color, borders, and more. Every change renders instantly on the page; no DevTools, no guessing, no refreshing. When you're done, export your changes as a CSS patch, a structured JSON file, or a ready-to-paste prompt for any AI coding assistant. Or go further: rebuild the whole page as clean HTML/CSS, or download an exact, ready-to-host copy — real fonts, real images, everything — for migrating off a platform like Squarespace or Wix entirely. Built for developers and designers who work in code but think visually. FEATURES ───────────────────────────────────────── Visual CSS editor Click any element to inspect and edit its styles in real time. Typography controls Font family, size, weight, line height, letter spacing, text color, transform, and alignment; all in one panel. Spacing and layout Sliders for padding, margin, border radius, border width, and opacity with live preview. Color picker Swatch + hex input with live preview as you drag. Layer tree Navigate parent and child elements without leaving the panel. Multi-select Shift+click to select multiple elements and edit them together. Export your changes Copy a CSS diff, download a JSON patch, or copy/download a prompt for any AI coding assistant to write the changes back into your project files. Website Clone Rebuild the current page as clean, semantic HTML and CSS — ready for an AI agent to implement, or to use as your own starting point. Exact Clone Download a byte-for-byte, self-contained copy of the current page — real fonts, images, CSS, and JS included — as a ready-to-host `.zip`. Built for migrating a site off a platform like Squarespace. Dark mode The editor panel matches your preference, light or dark. Change log Every edit is tracked in the session. Undo individual changes or reset an element to its original state at any time. WHO IS IT FOR ───────────────────────────────────────── • Developers building with Astro, Next.js, or any static site • Designers who want to prototype directly in the browser • Anyone migrating a site off a page builder like Squarespace or Wix • Anyone who has ever wished they could just click a thing and change it PRIVACY ───────────────────────────────────────── NudgeCSS does not collect or transmit any data to NudgeCSS or any third party. All edits stay in your browser. The one exception: the optional Exact Clone feature re-downloads the current page's own already-loaded images, fonts, CSS, and JS so it can package them into a local .zip file — the same files your browser already requested to render the page, sent nowhere but your own downloads folder. See the full privacy policy at nudgecss.com/privacy