A sleek, real-time HTML/CSS/JS code editor built with pure HTML, CSS, and JavaScript. Designed for beginners, students, and web dev enthusiasts who want a smooth in-browser coding experience.

• Live Preview — See your code output instantly inside an iframe.
• Three-Panel Layout — Separate editors for HTML, CSS, and JavaScript.
• Minimal & Clean UI — Dark theme, clean layout, easy to use.
• FontAwesome Icons for a modern tool-like feel.
• No frameworks needed — Runs entirely on the browser.

The editor listens for user typing events (onkeyup) and updates the iframe output dynamically:

• Inserts HTML into iframe.body
• Injects CSS using a <style> tag
• Executes JavaScript inside the iframe sandbox

This creates a safe, isolated environment where users can test HTML/CSS/JS without affecting the main site.

function run(){
let htmlCode = document.getElementById("html-code").value;
let cssCode = document.getElementById("css-code").value;
let jsCode = document.getElementById("js-code").value;
let output = document.getElementById("output");


output.contentDocument.body.innerHTML =
htmlCode + "<style>" + cssCode + "</style>";


output.contentWindow.eval(jsCode);
}

• Full‑screen editor
• Flexible layout using CSS flex
• Clean textarea panels
• Dark coding environment for comfort
• Polished labels with icons