HTML Viewer

Write or paste HTML and see a live preview instantly — with split view, format, import & export

HTML Editor1215 chars

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>Hello World</title>
  <style>
    body {
      font-family: system-ui, sans-serif;
      background: linear-gradient(135deg, #1e1b4b, #312e81);
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
    }
    .card {
      background: rgba(255,255,255,0.1);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255,255,255,0.2);
      border-radius: 1rem;
      padding: 2rem 3rem;
      text-align: center;
      color: white;
    }
    h1 { font-size: 2.5rem; margin: 0 0 0.5rem; }
    p { opacity: 0.7; font-size: 1.1rem; margin: 0; }
    button {
      margin-top: 1.5rem;
      padding: 0.75rem 2rem;
      border-radius: 2rem;
      border: none;
      background: #7c3aed;
      color: white;
      font-size: 1rem;
      cursor: pointer;
      transition: transform 0.2s;
    }
    button:hover { transform: scale(1.05); }
  </style>
</head>
<body>
  <div class="card">
    <h1>👋 Hello, World!</h1>
    <p>Edit the HTML on the left to see live preview.</p>
    <button onclick="this.textContent = '✨ Clicked!'">Click me</button>
  </div>
</body>
</html>

Live Preview Full page

Preview runs in a sandboxed iframe. Scripts are allowed but network requests are blocked.

🔒 All processing happens directly in your browser. No files are uploaded to our servers. Your data stays private and is never stored or shared. GDPR compliant.