我做了一個「乾淨」的網頁時鐘!

2026年8月24日.閱讀時間約 4分鐘

最近我在整理雙螢幕工作環境時,為了讓桌面視覺更乾淨,我把副螢幕的 Windows 工作列給隱藏了,並把 OBS 開在副螢幕隨時監控畫面。但很快就遇到一個尷尬的問題:只要主螢幕一進入遊戲或全螢幕播放,我就完全看不到當前時間。

原本想找看看 OBS 的狀態列有沒有原生顯示時間的功能,結果發現並不行。不過,OBS 其實有一個非常強大的功能——「自訂瀏覽器停駐視窗(Custom Browser Docks)」,可以將任何網頁直接嵌入到 OBS 的介面角落。

於是我開始在網路上尋找適合的網頁時鐘,結果大失所望。市面上的時鐘網站大多極其雜亂,包攬了大量的說明文字、巨大頁首頁尾、各式選項選單,甚至還有滿滿的廣告,放在 OBS 小小的停駐視窗裡顯得極度擁擠。

既然找不到滿意的,那就自己寫一個吧!我決定製作一個極度乾淨的線上網頁時鐘——畫面上除了時間與日期,什麼多餘的元素都沒有。


✨ 工具核心特色與設計亮點

這個網頁時鐘看似簡單,但在細節與操作上做了很多極簡與實用性的考量:

  • 極簡留白設計:預設只顯示時間與日期,滑鼠靜止後控制按鈕會自動隱藏(Auto-Hide),讓視覺焦點完全回歸時間本身。
  • 三種主題切換:
    • 深灰(預設):柔和不刺眼,適合日常電腦螢幕。
    • 純黑(OLED):純黑色背景,適合 OLED 螢幕或暗色系 OBS 介面,黑得徹底且省電。
    • 純白(明亮):高對比度,適合明亮環境與特殊搭配。
  • 全鍵盤快捷鍵操作:不需要開啟設定選單,滑鼠不在時也能快速切換:
    • H:切換 12/24 小時制
    • S:顯示 / 隱藏秒數
    • D:顯示 / 隱藏日期
    • T:快速切換背景主題
    • B:純鍵盤模式(永久隱藏設定齒輪按鈕)
    • ? 或 Esc:開啟 / 關閉設定選單
  • 手機與觸控防呆優化:針對手機或移動裝置,加入了雙擊螢幕喚醒選單的機制,開啟純鍵盤模式也不怕找不到選單。

🛠️ 如何在 OBS 中嵌入網頁時鐘?

想要把這個時鐘放到你的 OBS 介面裡,只需要簡單三個步驟:

  1. 開啟設定視窗:打開 OBS Studio,點擊上方選單列的 停駐視窗 ➔ 自訂瀏覽器停駐視窗。
  2. 新增停駐視窗:在「停駐視窗名稱」輸入欄寫上 時鐘(或任何你喜歡的名字),並在「URL」欄位貼上網頁時鐘的網址(https://blog.originalfries.com/tools/clean-clock/),點擊「套用」。
  3. 自由擺放位置:此時會彈出一個時鐘小視窗,用滑鼠左鍵按住視窗標題列,拖曳至 OBS 介面的任意角落,直到出現藍色預覽區塊後放開即可吸附。

💡 結語與線上使用

這款乾淨時鐘工具已經正式上線,無論你是需要放在 OBS 裡監看時間的創作者、實況主,還是想要在手機、平板上放一個乾淨桌面時鐘的人,都歡迎線上使用!

立即使用➔ 乾淨時鐘

返回頂端