設計
顏色工具
轉換 HEX、RGB、HSL 顏色，並檢查 WCAG 對比度以確保無障礙性。
顏色轉換
HEX
#007BFF
RGB
rgb(0, 123, 255)
HSL
hsl(211, 100%, 50%)
對比度檢查器 (WCAG)
對比度 21.00
一般文字
AA (4.5:1)
AAA (7.0:1)
大型文字
AA (3.0:1)
AAA (4.5:1)
預覽
敏捷的棕色狐狸跳過懶惰的狗。視野無限廣，窗外有藍天。
色彩轉換與對比檢查工具
在 HEX、RGB、HSL 之間轉換色彩，並檢查前景與背景的對比。適合 CSS 實作、設計交付、hover 狀態與 UI 可讀性檢查。
常見情境
- 轉換 CSS 色彩：在設計工具與程式碼格式間切換。
- 檢查可讀性：確認按鈕、連結、label 與 alert 的對比。
- 建立色彩變化：用 HSL 調整亮度與飽和度。
重要狀態不應只靠顏色傳達，應搭配文字、圖示或版面提示。
Recent Articles
工具介紹
2026-05-02
CSV 與 JSON 轉換：API 串接與資料移轉的格式選擇
了解如何安全地在 CSV 與 JSON 之間轉換，包含標題列、分隔符號、值的型別、巢狀資料與實務工作流程。
工具介紹
2026-05-02
JSON 格式化與驗證：安全檢查 API 回應的方法
了解如何格式化 JSON、找出語法錯誤、確認值的型別，並將 API 回應延伸成 TypeScript 型別、Zod Schema 或 OpenAPI 文件。
開發故事
2026-04-06
「誰也沒有更新架構圖」的問題
當有人問「等等，中間不是還有另一台伺服器嗎？」時，你是否曾感到背脊發涼？這就是打造即時 Mermaid 基礎設施視覺化工具的故事。
開發故事
2026-04-05
在 YAML 地獄中崩潰：為什麼我寫了一個 CI/CD 視覺化工具
當 GitHub Actions 中的 'needs' 依賴關係變得混亂到人類無法看清時，我決定將 YAML 迷宮變成一張俐落的流程圖。
開發故事
2026-04-04
別再為了 JOIN 哭泣：視覺化 SQL 產生器背後的故事
「等等，LEFT JOIN 是怎麼運作的？」我建立了這個無程式碼 SQL 工具，讓我們不用再浪費時間去除錯漏寫的逗號和語法錯誤。
開發故事
2026-03-09
用遞迴解決 JSON 轉 TypeScript：不依賴第三方庫的強大之處
「從 API 回應中瞬間生成型別定義。介紹不使用外部解析器、僅憑遞迴演算法實現輕量且高速轉換的幕後故事。」