日本語English

HTML/CSS/JavaScript Code Playground

Write HTML, CSS and JavaScript in three editors and press Run to see the result in the preview. console.log output and uncaught errors (with the JavaScript line number) show in the console, and you can export everything as one HTML file. Nothing runs just because you opened the page.

On-device・No uploadMobile friendlyWorks offline

Your files and input are processed only inside your browser on this device and are never uploaded to our servers.

Do not paste code someone else gave you
Your code runs in an isolated frame and cannot touch this page, its cookies or saved data. It can still make network requests from inside the frame (it runs with the same power as code you wrote yourself), so do not run code of unknown origin.

Not supported: No npm package imports, no server-side execution and no sharing with others (code is never put in the URL). alert and prompt are not shown; they are logged to the console instead.

HTML1 lines
CSS1 lines
JavaScript1 lines
Runs 0.8 s after you stop typing. If you write an infinite loop, press Stop. Ctrl + Enter also runs.
Result

Not run yet. Press Run to see the result here (the page never runs code just by opening).

Console

console.log output and uncaught errors appear here.

Saves only the code to this browser’s localStorage (nothing is sent to a server).

How to use

  1. index.html
    style.css, app.js

    Write the code

  2. Previewnever sent to a server
    Console output

    Run in an isolated frame

Write HTML, CSS and JavaScript and see how it runs right away

  1. Pick a template (Blank, Flexbox, Grid, Canvas) or the sample, or write your own code in the HTML, CSS and JavaScript editors.

  2. Press Run (Ctrl + Enter). The preview shows the result and the console shows console.log output, warnings and errors.

  3. Turn on "Run automatically after edits" to run 0.8 s after you stop typing.

  4. If an infinite loop hangs the frame, press Stop. The frame is discarded; fix the code and press Run again.

  5. Use "Export as HTML file" to save the three panes as one .html file. "Save in this browser" keeps only the code in localStorage.

What it does

Your code runs in an isolated frame

Code goes into an iframe with only sandbox="allow-scripts". It has no same-origin permission, so it cannot touch this page’s DOM, cookies or localStorage. Navigating this page away, popups, form submission, automatic downloads and alert/prompt dialogs are blocked too (the frame itself can still navigate to another page).

Console and exceptions

Output from console.log, info, warn, error and debug, plus uncaught exceptions and rejected promises, appears in the console. Errors raised inside the JavaScript pane carry a line number.

Stop rebuilds the frame

Stop discards the frame and turns off auto run. Nothing runs when the page opens or when saved code is loaded, so a saved infinite loop cannot lock you out of the page.

Three editors with line numbers

HTML, CSS and JavaScript each have an editor with line numbers. Each editor holds up to 200,000 characters and the three together up to 400,000.

Saving stays on your device

Optionally save only the code to localStorage. No share link with the code in the URL is made, and you can delete the saved code any time.

Use cases

  • Check how a layout or CSS (Flexbox, Grid) behaves without setting up a project
  • Run a short JavaScript snippet and read its console output and error line
  • Try a quick Canvas drawing or DOM experiment
  • Practice in the browser and take the result away as a single HTML file

Capability matrix

FeatureSupportNotes
Run HTML, CSS and JavaScript with a previewSupportedIn an isolated iframe
Console output and uncaught errors (with JavaScript line number)Supported—
Auto run, manual run and stopSupportedAuto run is off by default
Export as an HTML fileSupportedThe three panes are merged into one .html
Save to localStorage (code only)SupportedOptional; deletable any time
Blocking network access from the codeNot supportedCode in the frame can use fetch and similar. Do not run code of unknown origin
npm imports, TypeScript, SCSS or other build stepsNot supportedOnly HTML, CSS and JavaScript the browser understands as is
Server-side executionNot supportedEverything runs in the browser
Sharing with others (URL or live link)Not supportedThe code is never put in a URL. Export an HTML file and send that
alert, confirm and prompt dialogsPartialNot shown; logged to the console

Limits & notes

  • Each editor holds up to 200,000 characters and the three together up to 400,000.
  • The console records up to 500 entries.
  • Depending on the browser, an infinite loop can slow down the whole tab. If it hangs, turn off auto run and press Stop. Nothing runs when the page opens.
  • Line numbers are given only for uncaught errors raised inside the JavaScript pane, not for inline scripts you write in the HTML.
  • The isolation protects this page. It does not stop code in the frame from making network requests.
  • Running code works on a phone, but PC is recommended for editing in the three editors.

Privacy & safety

Your code is processed only in your browser and is not sent to a server. Only when you turn on saving is the code kept in this browser’s localStorage (deletable any time). If the code you run makes network requests, those requests come from your own code.

FAQ

Can I run HTML online here?
Yes. Write HTML, CSS and JavaScript and press Run; the result of the isolated frame appears in the preview. Execution happens only in your browser.
Can my code affect this site?
It runs without access to this page’s DOM, cookies or localStorage (sandbox="allow-scripts" only). Code in the frame can still make network requests, so do not paste code someone else gave you or code of unknown origin.
Is it an alternative to other online code playgrounds?
For trying single-page HTML, CSS and JavaScript, yes. There are no npm imports, no TypeScript or SCSS builds and no share links.
What happens with an infinite loop?
Press Stop to discard the frame. In some browsers the whole tab can become sluggish while a loop runs, so keep auto run off by default. Nothing runs automatically when the page opens or code is loaded.
Can I use alert or prompt?
No. No dialog is shown; the call is logged to the console as a warning. confirm always returns false and prompt always returns null.
Is my code saved?
Only when you turn on "Save in this browser", and only in this browser’s localStorage. Nothing is sent to a server, and you can delete it any time.

Code Formatter — Format & Minify

Paste code to format it with the language auto-detected. Choose indent, line width, semicolons, quotes and trailing commas; JavaScript, CSS and HTML can also be minified with before/after size and reduction. Your code never leaves the browser.

No upload

Markdown Studio — Live Editor & Preview

A split-view Markdown editor with instant GFM preview, a table formatter that aligns pipes, an automatic table of contents and HTML export. Output is always sanitized and external images load only when you allow them.

No upload

Regex Tester

Type a pattern and matches light up in the test string instantly. Capture groups, replacement output and what each part of the pattern means are all on one screen — and patterns that would freeze your browser are stopped after one second.

No upload

Diff Tool — Text & Code Compare

Paste or drop two versions and see added and removed lines, plus the exact words that changed inside each line. Copy or save the result as a unified patch. Nothing leaves your browser.

No upload

UUID / ULID / NanoID / Token Generator

A UUID is ready the moment the page opens. Switch to UUID v7, ULID, NanoID or a random token, generate up to 10,000 at once and save them as .txt, .csv or .json. Paste an existing UUID or ULID to read its embedded time and version.

No upload

JSON Studio — Formatter & Validator

Paste JSON to format, minify or validate it instantly. Errors are shown with the exact line, column and cause, and comments or trailing commas can be auto-repaired. Your data never leaves your device.

No upload

Last updated: