跳到取色器

Display P3 轉 HEX 轉換器

貼上 Display P3 值,立即得到 HEX。其他格式也一樣能用。

辨識為 CSS color()

HEX 值#ff5733

調整顏色

11°
100%

68%
0.210
34°

其他所有格式

Display P3 轉 HEX 範例

顏色Display P3HEX
color(display-p3 0.91749 0.20029 0.13856)#ff0000
color(display-p3 0.4584 0.98526 0.29829)#00ff00
color(display-p3 0 0 0.95959)#0000ff
color(display-p3 1 1 1)#ffffff
color(display-p3 0 0 0)#000000
color(display-p3 0.50196 0.50196 0.50196)#808080
color(display-p3 0.92577 0.38907 0.25797)#ff5733
color(display-p3 0.30473 0.50347 0.93383)#3b82f6
color(display-p3 0.33254 0.71471 0.52213)#10b981
color(display-p3 0.91216 0.63495 0.23045)#f59e0b
color(display-p3 0.51827 0.3688 0.93154)#8b5cf6
color(display-p3 0.85506 0.33272 0.5918)#ec4899

關於 Display P3 和 HEX

Display P3 是現代 Apple 螢幕和許多手機的廣色域,比 sRGB 多出約 25% 的顏色,寫成 color(display-p3 r g b)。

HEX 用兩位十六進位數字分別表示紅、綠、藍,例如 #ff5733。這是網頁和設計工具中最常見的顏色寫法。

轉換原理

我們讀取 Display P3 值,用 CSS Color 4 規範中的矩陣將它轉換為 CIE XYZ,再轉換為 HEX。超出目標色域的值會依 CSS Color 4 演算法映射:保留亮度和色相,降低彩度。

常見問題

如何將 Display P3 轉換為 HEX?

在上方欄位貼上或輸入 Display P3 值。PickShade 會在你輸入時用 CSS Color 4 公式即時轉換,點一下就能複製 HEX 值。

Display P3 轉 HEX 的結果精確嗎?

計算是精確的,結果只在顯示時四捨五入,保留的位數足以轉換回同一個顏色。如果顏色超出目標色域,PickShade 會提醒你,並顯示色域內最接近的顏色。

可以同時取得其他格式嗎?

可以。其他所有格式,包括 OKLCH、Display P3、Tailwind、SwiftUI、Flutter 和 Android,都列在結果下方,點一下就能複製。

這個轉換器免費嗎?

免費。不必註冊,而且完全在你的瀏覽器中執行。