UTILITY 02 — HTML LIVE EDITOR

HTML Live Editor

Write HTML, CSS and JS on the left, see it update on the right.

HTML

CSS

<h1>Hello, Sharmaji!</h1>
<p>Edit the HTML, CSS or JS tabs — the preview updates as you type.</p>
<button id="btn">Click me</button>

body {
  font-family: sans-serif;
  padding: 20px;
  color: #16223B;
}
button {
  padding: 8px 16px;
  cursor: pointer;
}

document.getElementById('btn').addEventListener('click', () => {
  alert('Button clicked!');
});

Auto-run as I type

Preview