Why Developers Love Web Maker
Offline Code Editor
Lives completely in your browser. No network required - opens and shows live previews instantly. Perfect for coding on flights, trains, or anywhere without internet.
Real-time Collaboration
Collaborate in real-time with others on your creations. Perfect for pair-programming, conducting technical interviews, or helping a friend learn to code.
SCSS, TypeScript, Pug & More
Full preprocessor support including Markdown, Pug (Jade), SCSS, LESS, Atomic CSS, JSX, CoffeeScript, and TypeScript - all built-in.
Add Any JavaScript Library
Drop in popular libraries like React, Vue, or jQuery from the built-in list, or add any library via CDN URL.
Flexible Editor Layouts
Choose from multiple layouts - side-by-side, stacked, or full-screen preview. Your layout preferences are saved automatically.
Files Mode - Like VS Code
Work with a complete file-based environment. Create folders and files just like in VS Code or your local IDE.
Screenshot Capture
Capture beautiful screenshots of your creations with one click. Perfect for sharing on social media or in documentation.
Export to CodePen
Ready to share your work? One click exports directly to CodePen for easy sharing and collaboration.
Built-in Dev Tools
JavaScript console, integrated Prettier formatting, command palette, keyboard shortcuts, and dark mode - everything you need.
Perfect For
Learning Web Development
Practice HTML, CSS, and JavaScript with instant feedback. No setup required.
Quick Prototypes
Test ideas and build prototypes faster than any other tool.
Technical Interviews
Conduct live coding interviews with real-time collaboration.
Teaching & Workshops
Share code instantly with students. Works offline in any environment.
Why Choose Web Maker Over CodePen or JSFiddle?
100% Offline
Unlike CodePen or JSFiddle, Web Maker works completely offline. Code anywhere, anytime.
Privacy First
Your code stays on your device. No account required to get started.
Instant Loading
No network latency. Opens instantly as a Chrome extension or PWA.
Real-time Collab
Share a link and code together in real-time, just like Google Docs.
♥ from all around
If you're looking for a CodePen-like offline editor, and use Chrome, check out Web-Maker by Kushagra Gour.
Really enjoying using Web Maker - super fast offline web playground.
Finding awesome pens on @CodePen and recreating them in @webmakerApp is my new hobby
This is something I will be using alot. Thank you! :D
It's fantastic! I'm glad I've discovered it! Thanks!
This is like having your own copy of Codepen that also works offline.
@webmakerApp looks like a good offline alternative to @CodePen.
Meet Web Maker, an Offline, Browser-based CodePen Alternative.
Great Chrome extension via @chinchang457. I need offline CodePen from time to time.
Thanks for creating this. What a great tool for productivity!
Decided to use it to work on my latest project, it's pretty awesome! Thank you for making this!
Web Maker needs the following permissions to work with full capabilities. In words of Chrome extensions:
Read & change all your data on the websites that you visit - Worry not. This is just required for the new tab replacement feature where Web Maker shows up only if the new tab url is chrome://newtab/. Nothing is read, stored or changed.
Disclaimer
Web Maker does not track any user specific data. It uses Google Analytics to track aggregated events to improve user experience based on what features are used more. If still you want to opt-out of Google Analytics tracking, please visit https://tools.google.com/dlpage/gaoptout or you can set up a filter in Adblock Plus or similar ad blocker tools like AdBlock, uBlock or Adblock Pro.