[开源] 全屏时钟 / Full Clock：放弃 time.is，用 Svelte 5 写了一个极致纯净的全屏时钟，解决秒数焦虑

文章[开源] 全屏时钟 / Full Clock：放弃 time.is，用 Svelte 5 写了一个极致纯净的全屏时钟，解决秒数焦虑分享给大家，欢迎收藏极客资料网，专注分享技术知识

产品介绍

你有没有遇到过这样的情况：网络环境受限导致 time.is 打开较慢；打开一个网站后各种时区信息都呈现到界面上，极其杂乱；或者点开后发现广告漫天，扰得人心神不宁？那么，这个网站就是你的不二之选。

---

全屏时钟（Full Clock），在线无广告网站，高度可配置，适合平板、电脑大屏，适用于多种场景：

• 学校考试大屏展示
• 会议背景显示
• 个人专注展示

---

点击下面的图片立即体验，或继续阅读，到文末再点击链接。

---

核心灵感

我们常遇到这样的困境：

• 关闭秒数显示总觉得精度太低，对时间无掌控感；
• 数字显示秒数总觉得变化太快，分秒流逝而焦虑；

因此，灵光一现，我想到了：

背景长条驱动的秒数显示

秒数不直接用数字展现，而是作为一个进度条，高度为整个界面高，随着时间的推移，从最左边推到最右边，又在新一分钟到来时归零。

如此配置，你想精确对时，定睛一看便知；想专心致志，画面静谧如止。全屏时钟追求的，就是这种润物无声的时光流逝。

可配置项一览

• 12/24 小时制
• 秒数显示多模式（关闭/数字显示/背景长条）
• 标题配置（可显示日期/关闭/自定义信息，适合考试科目时间展示）
• 主题配置（颜色、字体）
• 中/英双语支持
• 屏幕常亮：若你的浏览器支持 Wake Lock API，实现类似 Keep Screen On 网站的效果。
• 简易时间同步：即使你的电脑系统时间有几秒误差，Full Clock 也能通过前端同步技术，确保显示的时间精确无误。
• PWA 支持：你可以像安装原生 App 一样将其添加到桌面，离线可用，沉浸感更强。

---

技术复盘预览

本项目技术栈为 Svelte 5 + SvelteKit 2 + Vite 写成，构建产物为纯前端页面，可部署至 Vercel/Netlify 等平台。

我正在撰写一系列的产品复盘，如果你也是开发者，可以关注我，以了解：

1. 前端时间校准的实践
2. Svelte 的国际化基础与优化
3. Svelte 应用 PWA 和 SSR 的那些坑

敬请期待。当然，你也可以借助 阅读源码，汲取灵感。

---

结语

快速跳转：https://clock.cup11.top/zh

GitHub 开源：https://github.com/cup113/full-clock

如有愿意体验的读者，体验完成后也可在评论区交流、推荐、转发，欢迎积极互动！

文章来源:https://www.cnblogs.com/cup11/p/20207070
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若内容造成侵权/违法违规/事实不符，请联系邮箱：jacktools123@163.com进行投诉反馈，一经查实，立即删除！