Code Preview Extension

Write HTML, CSS & JS with a live preview, console, libraries, projects and export.

Live HTML, CSS & JavaScript playground, with a console, libraries and projects Code Preview Extension is a fast, private code playground that opens in a browser tab. Write your code and the preview updates as you type. No accounts, no servers, no setup. Perfect for: • Web developers who want to test code without leaving the browser • Students learning frontend development who need instant visual feedback • Designers experimenting with CSS styles and animations • Anyone prototyping a web component without setting up a project Key features: • Live preview that updates as you type (CSS changes apply without a reload) • Built-in console: errors link to the exact line, and you can run JavaScript inside the preview • Add libraries in one click from a built-in list of popular CSS and JavaScript libraries, or paste any CDN or localhost URL (local files auto-reload when they change) • Multiple projects, auto-saved. Export as a standalone .html file or a shareable .json • Draggable divider, side-by-side or stacked layout, and phone, tablet and desktop preview widths • Faster editing: Emmet-style shortcuts (type ul>li*3, press Tab), search and replace, code folding, auto-indent and keyboard shortcuts • Full HTML documents work: write <head>, <title> and <script> directly Privacy: Your code stays in your browser and is never sent anywhere. The extension has no account system and no tracking. Your settings may sync through your Chrome account if sync is on. Offline: The editor and preview work without internet. Libraries you add from a CDN need a connection to load. The code editor is powered by CodeMirror (MIT license).