Code Playground Online — Write HTML, CSS, JS with Monaco Editor Free

What is Code Playground?

Metoolzy Code Playground is an online code editor for HTML, CSS, and JavaScript — using Monaco Editor (the same engine as VS Code). You can write code and view a live preview right in the browser.

Similar to CodePen or JSFiddle but completely free, no account needed, and code is auto-saved in the browser.

Highlight Features

• Monaco Editor — Syntax highlighting, autocomplete, and error detection from VS Code
• Live Preview — Render results in an iframe, auto-run 500ms after you stop typing
• Console — Captures console.log, console.error, and console.warn from the preview
• 3 Layout modes — Tabs (1 editor + preview), Split 3 (3 editors simultaneously), Stacked
• External Libraries — Add Bootstrap, Tailwind, jQuery, Alpine.js, Chart.js, Three.js, GSAP, or custom CDN URLs
• Share via URL — Code is compressed using pako deflate → concise URL, anyone opening it sees the exact code
• Responsive Preview — Desktop, Tablet (768px), Mobile (375px)
• Auto-save — Code auto-saves to localStorage, won’t be lost on reload
• Download HTML — Export as a complete .html file
• Dark/Light theme — Toggle theme for the editor

Keyboard Shortcuts

Shortcut	Function
Ctrl+S	Run code (refresh preview)
Ctrl+1 / 2 / 3	Switch HTML / CSS / JS tabs
Ctrl+`	Toggle Console panel
Ctrl+Shift+F	Format code (HTML + CSS + JS)

Comparison with CodePen / JSFiddle

Feature	Metoolzy	CodePen	JSFiddle
Monaco Editor (VS Code)	✅	❌ CodeMirror	❌ CodeMirror
Free unlimited	✅	❌ Pro features	✅
No account needed	✅	❌	✅
Auto-save localStorage	✅	❌	❌
Share URL (compressed)	✅ pako	✅ server	✅ server
Custom CDN	✅	✅	✅
Console capture	✅	✅ (Pro)	❌
Draggable divider	✅	✅	❌

Frequently Asked Questions

Is the code lost when the tab is closed?

No. The code is auto-saved to localStorage every second. When reopened, the latest code is restored.

Does the shared link expire?

No. The code is encoded directly in the URL (not saved on a server). The link works forever.

Does it support TypeScript / SCSS?

Not currently. It only supports raw HTML, CSS, and JavaScript. TypeScript support is planned.

👉 Open Code Playground now →

See more: HTML Formatter · CSS Formatter · JS Formatter