<style>
body{font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft JhengHei', Roboto, 'Helvetica Neue', Arial, sans-serif;}
.red-color{color:#f00}
.blue-color{color:#f00}
</style>
###### tags: `JS`,`css`
# JS RGB To HEX
> [time=Fri, Dec 13, 2019 2:15 PM]
> [color=#000] [name=aikwdc00]
>
# 色碼介紹
較常用的色碼有RGB 與 HEX
### RGB
RGB色彩在網頁設計時的標記方式是 RGB(0~255 , 0~255, 0~255)，其中括弧內以逗號分隔的三組數值恰好就是 (R, G, B) 的色彩數值，所以數值會是 0~255 共256個數值的這個區間，而 RGB色彩大家應該都知道的混色原理就是加法混色，各位就直接用燈光來想吧，我們把0~255的數值當作是開燈的亮度來看，0就是沒開燈，255就是開到最亮。

### HEX
16進位碼簡寫為Hex，在HTML&CSS中16進位碼的色彩標示是由一個井號（＃）開始，接著後面帶6個數字來表示。

color: #rrggbb
分別是紅、綠、藍

### 轉換
rgb 如何轉換成 hex
可以透過js的Number.toString(16)
就能轉換為16進位

<iframe height="265" style="width: 100%;" scrolling="no" title="RGB TO HEX" src="https://codepen.io/aikwdc00/embed/WNbxYJE?height=265&theme-id=default&default-tab=js,result" frameborder="no" allowtransparency="true" allowfullscreen="true">
See the Pen <a href='https://codepen.io/aikwdc00/pen/WNbxYJE'>RGB TO HEX</a> by Fred
(<a href='https://codepen.io/aikwdc00'>@aikwdc00</a>) on <a href='https://codepen.io'>CodePen</a>.
</iframe>