<htmlstart/>
starter / dark-mode

Dark mode HTML template.

HTML5 boilerplate with prefers-color-scheme dark mode support. CSS variables, no JavaScript required.

  • prefers-color-scheme media query
  • CSS variable approach
  • No JS flash of wrong theme
  • Respects system preference
Ready in 10 seconds
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My HTML Page</title>
  <meta name="description" content="A page built with htmlstart.">
  <link rel="icon" type="image/svg+xml" href="/favicon.svg">

  <!-- Open Graph -->
  <meta property="og:title" content="My HTML Page">
  <meta property="og:description" content="A page built with htmlstart.">
  <meta property="og:type" content="website">
  <meta property="og:url" content="https://yourdomain.com/">
  <meta property="og:image" content="https://yourdomain.com/og.png">

  <style>
    :root{--bg:#fff;--fg:#111;}@media(prefers-color-scheme:dark){:root{--bg:#0a0a0a;--fg:#f4f4f4;}}body{background:var(--bg);color:var(--fg);}
  </style>
</head>
<body>

  <!-- your content here -->

</body>
</html>
27 lines
customise it

Tweak your boilerplate.

All options are pre-filled for Dark Mode HTML Template. Change anything, copy, ship.

Document
Meta & social
CSS framework
Fonts
JS Library
Extras
Analytics
index.html
27 lines 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>My HTML Page</title>
  <meta name="description" content="A page built with htmlstart.">
  <link rel="icon" type="image/svg+xml" href="/favicon.svg">

  <!-- Open Graph -->
  <meta property="og:title" content="My HTML Page">
  <meta property="og:description" content="A page built with htmlstart.">
  <meta property="og:type" content="website">
  <meta property="og:url" content="https://yourdomain.com/">
  <meta property="og:image" content="https://yourdomain.com/og.png">

  <style>
    :root{--bg:#fff;--fg:#111;}@media(prefers-color-scheme:dark){:root{--bg:#0a0a0a;--fg:#f4f4f4;}}body{background:var(--bg);color:var(--fg);}
  </style>
</head>
<body>

  <!-- your content here -->

</body>
</html>
ship it

Wrote the HTML. Now put it online.

Your file needs a home. TextraHost runs on hardware in India — low-latency for Indian visitors, no DNS acrobatics, cPanel included. Upload the file, point a domain, done.

See hosting plans → Starting ₹50/mo · India-based servers
// typical setup
1. Copy your HTML
2. Upload via cPanel File Manager
3. Point your domain
4. Live in ~2 minutes.