✨ v2.0 已发布 · 单文件 · 零依赖

用更少的代码
构建更快的网页

一个自包含的 HTML 模板：深色 / 浅色主题、响应式布局、滚动动画，全部内联在一个文件里，复制即可使用。

立即查看阅读示例

1单文件
0依赖
3s上手时间

为现代浏览器而生

没有构建步骤，没有冗余依赖，打开就能用。

⚡

极速加载

纯静态 HTML + 内联 CSS/JS，无外部请求，首屏几乎是瞬时的。

🎨

主题自由

基于 CSS 变量实现深色与浅色模式，一键切换并自动记住偏好。

📱

响应式布局

移动优先的弹性网格，从手机到桌面都能保持舒适阅读体验。

代码干净到可以背诵

语义化结构 + 少量 JavaScript，逻辑一目了然。

index.html

<!-- 复制即用：主题切换 -->
<button class="theme-btn" id="themeBtn">🌙</button>

<script>
  const root = document.documentElement;
  const btn  = document.getElementById('themeBtn');

  btn.addEventListener('click', () => {
    const next = root.dataset.theme === 'dark' ? 'light' : 'dark';
    root.dataset.theme = next;
    localStorage.setItem('theme', next);
  });
</script>

准备好了吗？

把这段代码保存成 .html 文件，双击即可在浏览器运行。

回到顶部