Sandbox
Home
About
Support Us
Eng
Tr
Hide Editor
Hide Preview
Export HTML
Home
About This Tool
Support Us
Export HTML Document
HTML/CSS/JS Editor
Lines:
1
1
<div class="p-8 bg-white rounded-2xl shadow-2xl max-w-sm mx-auto my-4 text-center border border-slate-100"> <h1 class="text-3xl font-bold text-slate-800 mb-2">My Website</h1> <p class="text-accent-600 font-medium">Live preview generated below!</p> <button onclick="showMessageBox('Button clicked!')" class="mt-4 px-6 py-2.5 btn-primary text-white font-medium rounded-full smooth-transition"> Click Me </button> </div> <style> body { margin: 0; padding: 20px; background: linear-gradient(135deg, #f0fdf4 0%, #f8fafc 100%); display: flex; justify-content: center; align-items: center; min-height: 100vh; transition: background-color 0.3s ease; font-family: 'Inter', sans-serif; } </style> <script> function showMessageBox(message) { console.log("Custom message:", message); window.showAppModal("Message", message, false); } </script>
Live Preview
Responsive
Message
Close
Export HTML
Enter a name for your file:
.html
Cancel
Download