選好顏色,複製代碼,繼續工作
選色器、漸層產生器和圖片滴管集於一頁。無需註冊、無需安裝、無需等待:選一個色調,複製為 HEX、RGB、HSL 或 HSV。
顏色代碼
HEX
#0F37FFRGB
rgb(15, 55, 255)HSL
hsl(230°, 100%, 52.94%)HSV
hsv(230°, 94.12%, 100%)CMYK
cmyk(94.12%, 78.43%, 0%, 0%)XYZ
xyz(19.61, 10.05, 95.5)LAB
lab(37.93, 62.96, -98.45)LCH
lch(37.93, 116.86, 302.6°)流行色
查看全部流行色包含哪些功能
滴管
從上傳的圖片取色,在瀏覽器支援時也可以從螢幕上任意位置取色。把檔案拖到頁面上,點擊像素即可。
格式轉換
在 HEX、RGB、HSL、HSV、CMYK、XYZ、LAB 和 LCH 之間即時切換,並把任一數值直接複製到 CSS 或設計軟體。
漸層產生器
在色條上新增並拖曳色標,切換線性與放射,調整角度和不透明度,然後複製完成的 CSS。
顏色紀錄
你做過的每個顏色和漸層都留在瀏覽器裡,方便以後回看或在別的專案裡重複使用。
配色與變化
每個顏色頁都提供淡色、暗色和六種配色方案,任一種都能一鍵變成漸層。
免費且注重隱私
沒有付費牆,也不會追蹤你選了什麼。上傳的圖片在瀏覽器內讀取,不會傳到任何地方。
適合誰使用
- 設計師與產品團隊
- 在勾勒介面或品牌色板、嘗試搭配、複製漸層所需的確切 CSS 時。
- 插畫與繪畫
- 用滴管從照片和畫作中取色,並用漸層工具規劃柔和的明暗過渡。
- 前端開發
- 在專案中產出一致的顏色數值,並從既有設計稿中讀回這些數值。
- 做無障礙檢查的人
- 在不同顏色模型之間對比同一個顏色,並調整到對比度達到所需門檻。
如何使用
- 1
選一個顏色
在飽和度區域點擊任意位置,再用色相和透明度滑桿微調。HEX、RGB 和 HSV 會同步更新。
- 2
從圖片取色
把圖片拖到頁面上或選擇檔案,然後點擊想要的像素,色值會立刻出現。
- 3
做一條漸層
點擊色條新增色標並拖到位置,切換線性或放射,再設定角度。
- 4
複製並使用
複製數值或整段 CSS 宣告。你選過的一切都會自動存進紀錄。
常見問題
一個不礙事的小工具
它最初只是內部小工具:我們想取個顏色、調一下就繼續做事,而不必先打開笨重的設計軟體。它刻意只有一頁,刻意保持輕快,並且會一直免費。
瀏覽器擴充功能
想直接從瀏覽的網頁取色?Chrome 和 Edge 擴充功能會在工具列加上滴管按鈕,保存各自的紀錄,並可一鍵開啟本工具。