搞這麼多年設計，會計算開發色值嗎？

摘要：此處要注意的是，代碼數制是十六進制，而我們平時用的數字是十進制，因此想要把開發色值轉譯爲RGB色號，只需要把這3組兩位數編碼轉換成十進制數字就好了。支付寶logo換色以後的藍色開發色值爲#1778FF（截屏取色，非官方），先把它拆成對應RGB的編碼17、78、FF，代入上面公式算出它們在十進制下等值的色號。

深耕設計多年的我們，平日裏各種玩轉sketch，吊打principle，逐浪C4D，早已熟知RGB、CMYK和HSB/HSV/HSL等不同的色彩模式，但你想過我們提交給開發爸爸們的色值是怎麼計算出來的嗎？

在計算機領域，開發色值是一種基於RGB色彩模式的十六進制顏色編碼。我們知道屏幕上看到的任何顏色都是由紅、綠、藍三種最基本的色光疊加形成的，這三種顏色參數的取值範圍都是0~255，因此RGB色彩模式也是所有傳統色彩模式裏色域空間最爲豐富的。

它包含了255×255×255＝16,581,375種顏色(與此對應，HSB/HSV/HSL色彩模式只包含了360×100×100＝3,600,000種顏色)，而這1600多萬種顏色在計算機語言裏就以“#”加6位代碼存在，因此這6位代碼與RGB色號有嚴格的對應關係。

6位代碼兩兩分爲3組，這3組編碼分別對應了RGB三個參數。此處要注意的是，代碼數制是十六進制，而我們平時用的數字是十進制，因此想要把開發色值轉譯爲RGB色號，只需要把這3組兩位數編碼轉換成十進制數字就好了！

怎麼轉呢？下方高能。

先講一個概念，位權。

位權是數制中每一個固定位置數碼所對應的權重。比如在十進制下，第2位(從右往左數)的位權爲10，第3位的位權爲100，總之第a位的位權就等於10的a-1次方。

什麼意思呢？拿最近比較火的325舉個例子，左邊3(第3位)的位權怎麼計算呢？

它＝10^ 3-1＝100

中間2(第2位)的位權＝10^ 2-1＝10

右邊5(第1位)的位權＝10^ 1-1＝1

(除0以外任何數的零次方都爲1)

因此對於N進制數，整數部分第x位的位權爲N^ x-1，理解了這個基礎概念，我們就能計算不同進制下的數值啦！

還拿325來舉例。上面的公式只幫我們算出了位權，而這組數碼代表的數值還要將位權乘以對應位置的基數，基數是什麼呢？就是3、2、5。

所以325這組數碼的數值

＝3×10^ 3-1+2×10^ 2-1+5×10^ 1-1

＝300+20+5

＝325

感覺好牛逼啊！

325＝325，好像講了一通廢話呢！

那是因爲我們這是在計算十進制，而325本來就是我們熟知的十進制結果。

如果現在告訴你325是一組十六進制代碼呢？它在十進制下等於多少？

簡單，代入上面公式。

它的十六進制數值

＝3×16^ 3-1+2×16^ 2-1+5×16^ 1-1

＝768+32+5

＝805

神奇吧！(✪₃✪)

理解到這一步，來詳細說一下十六進制。

十六進制一個週期的數碼符號有16個，表示爲0、1、2、3、4、5、6、7、8、9、A、B、C、D、E、F。其中A代表10，B代表11，C代表12，D代表13，E代表14，F代表15。這也就是我們平時爲什麼在開發色值代碼裏看不到什麼K啊、S啊、W這些F以後的字母。上面的325因爲沒有涉及到大於9的數碼，所以沒有出現字母。