All tools
TinyTools
Free tool
HTML
Preview
HTML
CSS
JS
▶ Run
HTML
Hello World!
Edit this code and see the preview update in real-time.
Click me
CSS
* { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: system-ui; padding: 2rem; background: #1a1a2e; color: #16130f; } h1 { color: #16130f; margin-bottom: 1rem; } p { margin-bottom: 1rem; color: #16130f; } button { background: #00d2ff; color: #1a1a2e; border: none; padding: .6rem 1.5rem; border-radius: 8px; font-size: 1rem; font-weight: 700; cursor: pointer; } button:hover { opacity: .8; } #output { margin-top: 1rem; font-size: 1.2rem; color: #16130f; }
JavaScript
let count = 0; document.getElementById('btn').addEventListener('click', () => { count++; document.getElementById('output').textContent = `Clicked ${count} time${count === 1 ? '' : 's'}!`; });