Skip to content

Instantly share code, notes, and snippets.

@HristoKolev
Created May 28, 2026 14:56
Show Gist options
  • Select an option

  • Save HristoKolev/48f1e8811d20c7d8e0f4dd17146d28db to your computer and use it in GitHub Desktop.

Select an option

Save HristoKolev/48f1e8811d20c7d8e0f4dd17146d28db to your computer and use it in GitHub Desktop.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>htmlpreview test</title>
<style>
body {
font-family: system-ui, sans-serif;
max-width: 40rem;
margin: 3rem auto;
padding: 0 1rem;
color: #222;
}
h1 {
color: #0a66c2;
}
button {
padding: 0.5rem 1rem;
font-size: 1rem;
cursor: pointer;
}
#out {
margin-top: 1rem;
padding: 0.75rem;
background: #f4f4f4;
border-radius: 4px;
font-family: monospace;
}
</style>
</head>
<body>
<h1>Hello from htmlpreview</h1>
<p>If you can see this rendered (not as raw source), htmlpreview.github.io is working.</p>
<button id="btn">Click me</button>
<div id="out">JavaScript output will appear here.</div>
<script>
const btn = document.getElementById('btn');
const out = document.getElementById('out');
let count = 0;
btn.addEventListener('click', () => {
count += 1;
out.textContent = `Clicked ${count} time${count === 1 ? '' : 's'} at ${new Date().toLocaleTimeString()}`;
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment