- 每月造訪次數
- 13.7K
- 上升11.0%較上月2026 年 10 月
- 公開營收
- 未公開
- 暫無公開營收證據
- 入門價
- 免費
- 沒有月付訂閱價
- 首次發布
- 4 年前
- 2021-12-16 · 估算
訪問
行銷動作
發布、搜尋與內容、引薦、促銷在 Show HN 發布（2 分 · 2 評論）發布
Overlayed – A Discord Overlay for Mac, Linux, and Windows — Hi HN Overlayed allows you to see who is currently in the voice channel you’re participating in. It shows you your voice status such as sp…
2024 年 2 月 23 日 · 2 年前發布頁
第三方評測與案例拆解
客戶來源管道拆解、工程師評測與開源檔案Show HN
2024-02-23查看原文
- 創作者原帖摘錄：
- Hi HN Overlayed allows you to see who is currently in the voice channel you’re participating in. It shows you your voice status such as speaking, deafened, and muted, but also other participants as well. It’s built with Tauri, React, zustand, Tailwind, shadcn/ui, and sprinkles of rust here and there. I get this question at least once a week, “why don’t you u
開源倉庫與自部署
GitHub 開源與智慧體接入
流量來源
2026 年 10 月
訪問構成
管道
- 自然搜尋48%
- 直接訪問23%
- 外部引薦15%
- 社交媒體8%
- 其他6%
國家/地區
- 美國67%
- 英國12%
- 印尼8%
- 加拿大6%
- 菲律賓4%
搜尋
站點權重 —網域名稱註冊 2021-11-17
| 關鍵字 | 月搜尋量 |
|---|---|
| overlayed | 680 |
| how to turn on discord overlay on max | 240 |
| discord voice square plugin | 140 |
| how to turn on discord overlay on mac | 70 |
| games that discord recognize | 60 |
流量資料：Vaneform
定價
尚未識別出定價頁，或該頁面沒有公開價格。
頁面與變化
開始記錄於 2021-12-16
關鍵頁面
每週快照overlayed.dev/ 快照 2026-11-04
設計
首屏畫面視覺分析與 :root CSS
深色背景襯托白色品牌標誌與大號無襯線標題，品牌名以藍紫漸層突出；下方排列三款系統下載卡片與 GitHub 星標徽章。
首屏畫面預覽 · 點擊放大
首屏畫面講了什麼與轉化路徑
“Welcome to Overlayed”
頂部導航橫向排布；中央依次放置品牌標誌、GitHub 徽章、標題、簡介與下載按鈕，底部露出功能卡片。
首屏畫面轉化路徑：居中標題加按鈕 + 純排版與圖形幾何 → 下載用戶端 / 安裝外掛 · 配合使用者頭像疊放與評語建立信任
色板 · 點擊複製
五維設計評分7.5 / 10
- 字體與排版
- 8.0
- 色彩與對比
- 8.0
- 構圖與留白
- 8.0
- 細節與工藝
- 7.0
- 風格辨識度
- 6.0
結構
- 字體
- Inter
- 首屏畫面版式
- 居中標題加按鈕
- 主視覺
- 純排版與圖形幾何
- 轉化動作
- 下載用戶端 / 安裝外掛
- 信任背書
- 使用者頭像疊放與評語
- 導航
- 頂部通欄導航
- 明暗與密度
- 深色 · 適中
- 圓角與層級
- 中圓角 · 細線分層
預覽 AI 設計說明全文（含 :root CSS 變量與版式規則）只寫風格參數，禁止復刻該產品的品牌名、標誌、文案與圖片
# 設計說明：極簡單色（兼備暗色開發者）
黑白灰加一個強調色，細線分隔，大量留白，靠字號與字重分層級。
## 設計參數
```css
:root {
--background: #121318;
--surface: #202c3e;
--foreground: #f6f6f8;
--muted-foreground: #a3a4ad;
--accent: #6864f5;
--radius: 8px;
--font-heading: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
}
```
色彩面積配比：背景 #121318（約 77%） · 面板 #202C3E（約 10%） · 正文 #F6F6F8（約 6%） · 次要文字 #A3A4AD（約 5%） · 強調 #6864F5（約 2%）。背景與面板占絕大部分面積，強調色只用於主按鈕與當前激活狀態。
## 版式與轉化結構
- 首屏畫面版式：居中標題加按鈕
- 導航結構：頂部通欄導航
- 明暗與密度：深色 · 適中
- 圓角與層級：中圓角；不用陰影，用細線與留白區分層級
- 主視覺載體：純排版與圖形幾何
- 轉化動作：下載用戶端 / 安裝外掛 · 信任背書採用使用者頭像疊放與評語
- 標題切入點：品類定位錨點
- 首屏畫面元件特徵：資料指標欄、懸浮多卡片
- 空間布局拆解：頂部導航橫向排布；中央依次放置品牌標誌、GitHub 徽章、標題、簡介與下載按鈕，底部露出功能卡片。
- 視覺特徵總結：深色背景襯托白色品牌標誌與大號無襯線標題，品牌名以藍紫漸層突出；下方排列三款系統下載卡片與 GitHub 星標徽章。
## 避免
- 多種強調色並用
- 漸層背景
- 重陰影
請按上面的設計參數與版式實現介面：顏色只用這些變量，強調色只給主要操作與當前狀態。只採用這種風格，禁止復刻任何參考產品的品牌名、標誌、文案與圖片。
問題與證據
同分類研究對象
效率與協作 / 桌面與視窗管理
這些產品屬於同一目錄分類。選型時請進一步核對客戶任務、功能與部署要求。