색상 코드 편집하기

'''색상 코드'''(Color code)는 개체의 [[색깔]]을 표기하기 위해 만들어진 디지털 코드다. [[컴퓨터 프로그래밍]] 및 [[HTML]] 등에서 사용되며, 표기하는 방식에는 크게 세 가지가 있다. 인쇄물에는 [[CMYK]]나 [[팬톤]]을 사용한다.

== 기본 : RGB 색상 코드 ==
빨강(Red), 초록(Green), 파랑(Blue)의 3색, 즉 빛의 3원색을 서로 더하는(+) 방식으로 섞어서 색상을 표기하는 방식을 [[RGB]] 가산혼합<ref>색이 진하게 섞이면 섞일수록 하얀색에 가까워진다.</ref>이라고 한다. 이러한 방식으로 색상 코드를 표기할 때는
다음과 같은 표기 방식을 사용한다.

{|style="text-align:center;"
! !!colspan=2 style="text-align:left;"|{{색|#FF0000|빨간색의 정도(00~FF)}}!!colspan=2 style="text-align:right;"|{{색|#0000FF|파란색의 정도(00~FF)}}
|-
|<big><big><big><big><big><big>{{색|#33759f|#}}</big></big></big></big></big></big>||<big><big><big><big><big><big>{{색|#FF0000|33}}</big></big></big></big></big></big>||colspan=2|<big><big><big><big><big><big>{{색|#00FF00|75}}</big></big></big></big></big></big>||<big><big><big><big><big><big>{{색|#0000FF|9F}}</big></big></big></big></big></big>
|-
! !!colspan=4 style="text-align:center;"|{{색|#00FF00|초록색의 정도(00~FF)}}
|}

'#'문자 뒤에 [[16진수]] 두 자리를 세 번 나열하여 첫 번째 구간에는 {{색|#FF0000|빨강}}, 두 번째 구간에는 {{색|#00FF00|초록}}, 세 번째 구간에는 {{색|#0000FF|파랑}}의 정도를 표기한다. 그 범위는 00~FF이며, 숫자가 커질수록(알파벳이 진행될수록) 더욱 밝아진다.

따라서 #000000은 검은색, #FFFFFF는 하얀색이다.
{|class="wikitable" style="text-align:center;"
|-
|빨강의 밝기 비교||{{색상|#000000|#000000}}, {{색상|#450000|#450000}}, {{색상|#770000|#770000}}, {{색상|#9B0000|#9B0000}}, {{색상|#FF0000|#FF0000}}
|-
|초록의 밝기 비교||{{색상|#000000|#000000}}, {{색상|#004500|#004500}}, {{색상|#007700|#007700}}, {{색상|#009B00|#009B00}}, {{색상|#00FF00|#00FF00}}
|-
|파랑의 밝기 비교||{{색상|#000000|#000000}}, {{색상|#000045|#000045}}, {{색상|#000077|#000077}}, {{색상|#00009B|#00009B}}, {{색상|#0000FF|#0000FF}}
|}
위 예시를 볼 때, 숫자가 45까지 진행되어도 자세히 보지 않으면 구분이 어려울 정도로 거의 검은색에 가까운 명도를 보인다는 것을 알 수 있을 것이다.
<ref>표기되는 환경에 따라 다소 차이가 있다.</ref> 

2자리의 [[16진수]]가 표현할 수 있는 범위가 0~255이므로, 위와 같은 방법을 사용한 색상 코드로는 총 16,777,216가지(16<sup>6</sup>=2<sup>24</sup>)의 색을 표현할 수 있다.

== 색상 코드표 ==

각 색상에는 따로 정해진 이름이 있는데, [[색상 이름]] 항목에서 자세히 다루도록 한다. 편의를 위해  [[X11|X11 표준]], [[HTML|HTML 4.01]]을 함께 나열하였다.<ref>모바일에서 원활하게 표기가 되지 않아 X11 표준을 먼저, HTML 4.01을 나중에 나열하였다.</ref>
여기서는 초록의 정도가 가장 강한 색을 lime(#00FF00)이라 표기한다. green은 #008000.

{|class="wikitable" 
|+X11 표준
!이름   
!색상 <br />코드
!이름   
!색상 <br />코드
!이름   
!색상 <br />코드
|-

| red 
| style="background:#ff0000; color:#ffffff" | #FF0000 
| lime 
| style="background:#00ff00; color:#ffffff" | #00FF00
| blue 
| style="background:#0000ff; color:#ffffff" | #0000FF
|-

| indianred
| style="background:#cd5c5c; color:#ffffff" | #CD5C5C
| aquamarine
| style="background:#7fffd4; color:#ffffff" | #7FFFD4 
| cyan(=aqua)
| style="background:#00ffff; color:#ffffff" | #00FFFF 
|-

| darksalmon
| style="background:#e9967a; color:#ffffff" | #E9967A 
| mediumspringgreen
| style="background:#00fa9a; color:#ffffff" | #00FA9A 
| aqua(=cyan)
| style="background:#00ffff; color:#ffffff" | #00FFFF 
|-

| lightcoral
| style="background:#f08080; color:#ffffff" | #F08080 
| springgreen
| style="background:#00ff7f; color:#ffffff" | #00FF7F 
| mediumturquoise
| style="background:#48d1cc; color:#ffffff" | #48D1CC 
|-

| salmon
| style="background:#fa8072; color:#ffffff" | #FA8072 
| palegreen
| style="background:#98fb98; color:#ffffff" | #98FB98 
| darkturquoise
| style="background:#00ced1; color:#ffffff" | #00CED1 
|-

| orangered
| style="background:#ff4500; color:#ffffff" | #FF4500 
| greenyellow
| style="background:#adff2f; color:#ffffff" | #ADFF2F 
| cadetblue
| style="background:#5f9ea0; color:#ffffff" | #5F9EA0 
|-

| crimson
| style="background:#dc143c; color:#ffffff" | #DC143C 
| chartreuse
| style="background:#7fff00; color:#ffffff" | #7FFF00 
| slategray
| style="background:#708090; color:#ffffff" | #708090
|-

| firebrick
| style="background:#b22222; color:#ffffff" | #B22222
| lawngreen
| style="background:#7cfc00; color:#ffffff" | #7CFC00 
| lightcyan
| style="background:#e0ffff; color:#000000" | #E0FFFF 
|-

| darkred
| style="background:#8b0000; color:#ffffff" | #8B0000 
| green
| style="background:#008000; color:#ffffff" | #008000 
| paleturquoise
| style="background:#afeeee; color:#ffffff" | #AFEEEE
|-

| mediumvioletred
| style="background:#c71585; color:#ffffff" | #C71585 
| lightgreen
| style="background:#90ee90; color:#ffffff" | #90EE90 
| powderblue
| style="background:#b0e0e6; color:#ffffff" | #B0E0E6
|-

| pink
| style="background:#ffc0cb; color:#ffffff" | #FFC0CB
| yellowgreen
| style="background:#9acd32; color:#ffffff" | #9ACD32
| lightsteelblue
| style="background:#b0c4de; color:#ffffff" | #B0C4DE
|-

| lightpink
| style="background:#ffb6c1; color:#ffffff" | #FFB6C1 
| limegreen
| style="background:#32cd32; color:#ffffff" | #32CD32 
| steelblue
| style="background:#4682b4; color:#ffffff" | #4682B4 
|-

| hotpink
| style="background:#ff69b4; color:#ffffff" | #FF69B4 
| mediumseagreen
| style="background:#3cb371; color:#ffffff" | #3CB371
| lightblue
| style="background:#add8e6; color:#ffffff" | #ADD8E6
|-

| deeppink
| style="background:#ff1493; color:#ffffff" | #FF1493 
| darkseagreen
| style="background:#8fbc8f; color:#ffffff" | #8FBC8F 
| skyblue
| style="background:#87ceeb; color:#ffffff" | #87CEEB
|-

| paleviolentred
| style="background:#db7093; color:#ffffff" | #DB7093 
| forestgreen
| style="background:#228b22; color:#ffffff" | #228B22
| lightskyblue
| style="background:#87cefa; color:#ffffff" | #87CEFA
|-

| darkkhaki
| style="background:#bdb76b; color:#ffffff" | #BDB76B 
| seagreen
| style="background:#2e8b57; color:#ffffff" | #2E8B57 
| deepskyblue
| style="background:#00bfff; color:#ffffff" | #00BFFF
|-

| khaki
| style="background:#f0e68c; color:#ffffff" | #F0E68C 
| olivedrab
| style="background:#6b8e23; color:#ffffff" | #6B8E23 
| cornflowerblue
| style="background:#6495ed; color:#ffffff" | #6495ED 
|-

| palegoldenrod
| style="background:#eee8aa; color:#000000" | #EEE8AA
| olive
| style="background:#808000; color:#ffffff" | #808000 
| royalblue
| style="background:#4169e1; color:#ffffff" | #4169E1 
|-

| lightgoldenrodyellow
| style="background:#fafad2; color:#000000" | #FAFAD2 
| darkolivegreen
| style="background:#556b2f; color:#ffffff" | #556B2F 
| mediumslateblue
| style="background:#7b68ee; color:#ffffff" | #7B68EE 
|-

| lightyellow
| style="background:#ffffe0; color:#000000" | #FFFFE0 
| darkgreen
| style="background:#006400; color:#ffffff" | #006400 
| dodgerblue
| style="background:#1e90ff; color:#ffffff" | #1E90FF 
|-

| lemonchiffon
| style="background:#fffacd; color:#000000" | #FFFACD 
| mediumaquamarine
| style="background:#66cdaa; color:#ffffff" | #66CDAA 
| mediumblue
| style="background:#0000cd; color:#ffffff" | #0000CD 
|-

| yellow
| style="background:#ffff00; color:#000000" | #FFFF00 
| turquoise
| style="background:#40e0d0; color:#ffffff" | #40E0D0
| darkblue
| style="background:#00008b; color:#ffffff" | #00008B 
|-

| gold
| style="background:#ffd700; color:#ffffff" | #FFD700 
| lightseagreen
| style="background:#20b2aa; color:#ffffff" | #20B2AA 
| navy
| style="background:#000080; color:#ffffff" | #000080 
|-

| papayawhip
| style="background:#ffefd5; color:#000000" | #FFEFD5 
| darkcyan
| style="background:#008b8b; color:#ffffff" | #008B8B 
| midnightblue
| style="background:#191970; color:#ffffff" | #191970
|-

| moccasin
| style="background:#ffe4b5; color:#000000" | #FFE4B5 
| teal
| style="background:#008080; color:#ffffff" | #008080 
| gainsboro
| style="background:#dcdcdc; color:#000000" | #DCDCDC 
|-

| peachpuff
| style="background:#ffdab9; color:#000000" | #FFDAB9 
| honeydew
| style="background:#f0fff0; color:#000000" | #F0FFF0 
| lightgrey
| style="background:#d3d3d3; color:#000000" | #D3D3D3
|-

| lightsalmon
| style="background:#ffa07a; color:#ffffff" | #FFA07A 
| mintcream
| style="background:#f5fffa; color:#000000" | #F5FFFA 
| silver
| style="background:#c0c0c0; color:#ffffff" | #C0C0C0 
|-

| orange
| style="background:#ffa500; color:#ffffff" | #FFA500 
| azure
| style="background:#f0ffff; color:#000000" | #F0FFFF 
| darkgray
| style="background:#a9a9a9; color:#ffffff" | #A9A9A9
|-

| darkorange
| style="background:#ff8c00; color:#ffffff" | #FF8C00 
| aliceblue
| style="background:#f0f8ff; color:#000000" | #F0F8FF 
| gray(grey)
| style="background:#808080; color:#ffffff" | #808080 
|-

| coral
| style="background:#ff7f50; color:#ffffff" | #FF7F50 
| ghostwhite
| style="background:#f8f8ff; color:#000000" | #F8F8FF 
| dimgray
| style="background:#696969; color:#ffffff" | #696969 
|-

| tomato
| style="background:#ff6347; color:#ffffff" | #FF6347 
| whitesmoke
| style="background:#f5f5f5; color:#000000" | #F5F5F5 
| darkslategray
| style="background:#2f4f4f; color:#ffffff" | #2F4F4F
|-

| orangered
| style="background:#ff4500; color:#ffffff" | #FF4500 
| lavenderblush
| style="background:#fff0f5; color:#000000" | #FFF0F5 
| lightslategray
| style="background:#778899; color:#ffffff" | #778899 
|-

| lavender
| style="background:#e6e6fa; color:#000000" | #E6E6FA 
| mistyrose
| style="background:#ffe4e1; color:#000000" | #FFE4E1 
| peru
| style="background:#cd853f; color:#ffffff" | #CD853F
|-

| thistle
| style="background:#d8bfd8; color:#ffffff" | #D8BFD8 
| antiquewhite
| style="background:#faebd7; color:#000000" | #FAEBD7 
| chocolate
| style="background:#d2691e; color:#ffffff" | #D2691E
|-

| plum
| style="background:#dda0dd; color:#ffffff" | #DDA0DD 
| seashell
| style="background:#fff5ee; color:#000000" | #FFF5EE 
| maroon
| style="background:#800000; color:#ffffff" | #800000 
|-

| violet
| style="background:#ee82ee; color:#ffffff" | #EE82EE
| snow
| style="background:#fffafa; color:#000000" | #FFFAFA 
| saddlebrown
| style="background:#8b4513; color:#ffffff" | #8B4513 
|-

| fuchsia(=magenta)
| style="background:#ff00ff; color:#ffffff" | #FF00FF 
| beige
| style="background:#f5f5dc; color:#000000" | #F5F5DC 
| brown
| style="background:#a52a2a; color:#ffffff" | #A52A2A 
|-

| magenta(=fuchsia)
| style="background:#ff00ff; color:#ffffff" | #FF00FF
| linen
| style="background:#faf0e6; color:#000000" | #FAF0E6 
| sienna
| style="background:#a0522d; color:#ffffff" | #A0522D 
|-

| orchid
| style="background:#da70d6; color:#ffffff" | #DA70D6 
| oldlace
| style="background:#fdf5e6; color:#000000" | #FDF5E6 
| darkred
| style="background:#8b0000; color:#ffffff" | #8B0000 
|-

| cornsilk
| style="background:#fff8dc; color:#000000" | #FFF8DC 
| floralwhite
| style="background:#fffaf0; color:#000000" | #FFFAF0 
| burlywood
| style="background:#deb887; color:#ffffff" | #DEB887
|-

| blanchedalmond
| style="background:#ffebcd; color:#000000" | #FFEBCD 
| ivory
| style="background:#fffff0; color:#000000" | #FFFFF0 
| tan
| style="background:#d2b48c; color:#ffffff" | #D2B48C
|-

| bisque
| style="background:#ffe4e4; color:#000000" | #FFE4E4 
| mediumorchid
| style="background:#ba55d3; color:#ffffff" | #BA55D3 
| rosybrown
| style="background:#bc8f8f; color:#ffffff" | #BC8F8F
|-

| navajowhite
| style="background:#ffdead; color:#000000" | #FFDEAD 
| darkorchid
| style="background:#9932cc; color:#ffffff" | #9932CC 
| mediumpurple
| style="background:#9370db; color:#ffffff" | #9370DB 
|-

| blueviolet
| style="background:#8a2be2; color:#ffffff" | #8A2BE2 
| darkviolet
| style="background:#9400d3; color:#ffffff" | #9400D3 
| darkmagenta
| style="background:#8b008b; color:#ffffff" | #8B008B 
|-

| slateblue
| style="background:#6a5acd; color:#ffffff" | #6A5ACD 
| purple
| style="background:#800080; color:#ffffff" | #800080 
| wheat
| style="background:#f5deb3; color:#000000" | #F5DEB3 
|-

| darkslateblue
| style="background:#483d8b; color:#ffffff" | #483D8B 
| indigo
| style="background:#4b0082; color:#ffffff" | #4B0082 
| darkgoldenrod
| style="background:#b8860b; color:#ffffff" | #B8860B 
|-

| sandybrown
| style="background:#f4a460; color:#ffffff" | #F4A460 
| goldenrod
| style="background:#daa520; color:#ffffff" | #DAA520 
| 
| 
|-

| black
| style="background:#000000; color:#ffffff" | #000000 
| white
| style="background:#ffffff; color:#000000" | #FFFFFF 
| 
| 
|-

|}

{|class="wikitable" align="center"
|+HTML 4.01
!이름
!색상 코드
!이름
!색상 코드
!이름
!색상 코드
|-

| red 
| style="background:#ff0000; color:#ffffff" | #FF0000 
| lime 
| style="background:#00ff00; color:#ffffff" | #00FF00
| blue 
| style="background:#0000ff; color:#ffffff" | #0000FF
|-

| white
| style="background:#ffffff; color:#000000" | #FFFFFF 
| black
| style="background:#000000; color:#ffffff" | #000000 
| gray(grey)
| style="background:#808080; color:#ffffff" | #808080 
|-

| teal
| style="background:#008080; color:#ffffff" | #008080 
| green
| style="background:#008000; color:#ffffff" | #008000 
| aqua
| style="background:#00ffff; color:#ffffff" | #00FFFF 
|-

| silver
| style="background:#c0c0c0; color:#ffffff" | #C0C0C0 
| maroon
| style="background:#800000; color:#ffffff" | #800000 
| purple
| style="background:#800080; color:#ffffff" | #800080  
|-

| olive
| style="background:#808000; color:#ffffff" | #808000 
| navy
| style="background:#000080; color:#ffffff" | #000080
| fuchsia
| style="background:#ff00ff; color:#ffffff" | #FF00FF 
|-

| yellow
| style="background:#ffff00; color:#000000" | #FFFF00 
| 
|  
| 
|  
|-

|}

== 웹 안전 색상 ==
웹 안전 색상이란 호환성을 위해, 즉 '여기서는 구분되던 색상이 저기서는 구분되지 않는 경우'를 피하기 위해 위의 색의 가짓수를 대폭 요약해서 표준으로 설정한 색을 말한다. 각 색에서 256가지 단계를 다 세는 것이 아닌, 255를 5로 나눈 숫자인 51을 기준으로 0에서부터 뛰어세기하여 0, 51, 102, 153, 204, 255의 여섯 번만을 세는 방식이다.

웹 안전 색상은 모두 216가지<ref>각 색상당 여섯 번을 세게 되므로 6x6x6=216이다.</ref>이며 그 중 '가장 안전한 색상' 22가지가 존재한다.

== 그 외 ==
[[ASS코드|ASS파일에서 쓰이는 색상코드]]가 따로 있으며, [[CMYK]]라는 미술 시간에 배우던 감산혼합 방식도 있다.

=== 쉘, 커맨드 ===
쉘, 명령 프롬프트에도 색상 지정이 가능하다.

== 외부 참조 ==
* <small>'''(한국어)'''</small> [http://html-color-codes.info/Korean/ HTML 컬러 코드] (색상표 제공)

{{각주}}
{{틀:색 둘러보기}}
[[분류:인터넷]]
[[분류:색]]
[[분류:식별자]]
[[분류:컴퓨터 프로그래밍]]