Skip to content

Playground

HTML & CSS playground

Write HTML, CSS and JavaScript, and your own browser renders the page right here. HTML and CSS update as you type; JavaScript runs when you press Run. The preview sits in a locked-down frame that cannot reach the network, open pop-ups, submit forms, or read anything from this site. How the sandbox works, and its honest limits, is on the code execution and security page.

Rendered by your own browser, so there is no runtime to download

What the preview can and cannot do

It is your real browser rendering your real page, inside a locked-down frame:

  • No network. External images, fonts, stylesheets, scripts and fetch() requests are all blocked, so use CSS, inline SVG or data: URLs instead.
  • alert(), confirm() and prompt() do not open dialogs. An alert() message appears in the console under the preview; confirm() returns false and prompt() returns null.
  • HTML and CSS update as you type. JavaScript runs only when you press Run, because live-reloading a half-written loop could freeze the tab.
  • An infinite loop in your JavaScript can still freeze this tab. If that happens, reload the page.
  • Nothing is saved. Copy your code somewhere before you leave the page.

Press Esc then Tab to leave the editor. Ctrl/Cmd+Enter runs everything.

Preview
Console
console.log() output and errors from your page appear here.

Not sure what to type?

A blank editor is the hard place to start. The HTML & CSS guide has a complete first program and a learning order to follow.

Other playgrounds