Secara biologis, mata kita dapat mengangkap warna dikarenakan spektrum cahaya yang di pantulkan benda-benda disekeliling kita ke indra penglihatan kita yaitu mata lalu diproses oleh otak kita menjadi warna-warna tertentu sumber cahaya bisa dari matahari atau sumber cahaya buatan.
Menurut teori warna dari Teori Brewster yang pertama kali dikemukakan pada tahun 1831. Warna-warna yang ada di alam jika disederhanakan dapat dikelompokkan menjadi 4 kelompok warna, yaitu Warna Primer, warna Sekunder, warna Tersier dan warna Netral. dan ini diwujudkan dalam bentuk lingkaran warna, lingkaran warna brewster mampu menjelaskan teori kontras warna (komplementer), split komplementer, triad, dan tetrad.
1. Warna Primer
Menurut teori warna dari Teori Brewster yang pertama kali dikemukakan pada tahun 1831. Warna-warna yang ada di alam jika disederhanakan dapat dikelompokkan menjadi 4 kelompok warna, yaitu Warna Primer, warna Sekunder, warna Tersier dan warna Netral. dan ini diwujudkan dalam bentuk lingkaran warna, lingkaran warna brewster mampu menjelaskan teori kontras warna (komplementer), split komplementer, triad, dan tetrad.
1. Warna Primer
Warna primer menurut teori warna pigmen dari Brewster adalah warna-warna dasar. Warna-warna lain dibentuk dari kombinasi warna-warna primer. Pada awalnya, manusia mengira bahwa warna primer tersusun atas warna Merah, Kuning, dan Hijau.
Namun dalam penelitian lebih lanjut, dikatakan tiga warna primer yaitu :
1. Merah seperti darah
2. Kuning seperti warna tengah telur
3. Biru seperti warna langit atau permukaan air laut
1. Merah seperti darah
2. Kuning seperti warna tengah telur
3. Biru seperti warna langit atau permukaan air laut
Warna primer atau warna pokok adalah warna-warna yang tidak dapat dihasilkan dari pencampuran warna lainnya. Dari pengertian di atas maka hitam, putih, emas dan perak dapat dimasukkan dalam kategori warna pokok.
Namun karena hitam, putih, emas dan perak tidak menampakkan kroma tertentu, maka warna-warna tersebut danggap bukan warna. Bahkan sebahagian orang ada yang mengelompokkan hitam dan putih sebagai ‘warna netral’, dapat dipasangkan sebagai penetralisir bagi warna apapun.
Dengan alasan tersebut, maka warna pokok hanya terdiri dari warna kuning, merah dan biru. Skema warna di atas dikenal juga dengan skema warna triadic karena masing-masing warna tersebut terletak pada titik sudut segitiga sama kaki dalam lingkaran warna.
2. Warna Sekunder
2. Warna Sekunder
Merupakan hasil pencampuran dari warna-warna primer dengan perbandingan 1:1. Pencampuran tersebut menghasilkan warna baru yang dinamakan warna sekunder.
Kita lihat pencampuran warna berikut :
Kuning + merah = orange
Kuning + biru = hijau
Biru + merah = ungu
3. Warna Tersier
Kuning + merah = orange
Kuning + biru = hijau
Biru + merah = ungu
3. Warna Tersier
Warna tersier adalah hasil pencampuran warna primer dengan warna sekunder. Kita lihat contoh campuran berikut :
Kuning + orange= kuning orange (golden yellow)
Merah + orange= merah orange (burnt orange)
Kuning + hijau= kuning hijau (lime green)
Biru + hijau= biru hijau (turquoise)
Biru + ungu= biru ungu (indigo)
Merah+ ungu= merah ungu (crimson)
4. Warm
warna-warna yang hangat, contoh : merah, orange, kuning
Kuning + orange= kuning orange (golden yellow)
Merah + orange= merah orange (burnt orange)
Kuning + hijau= kuning hijau (lime green)
Biru + hijau= biru hijau (turquoise)
Biru + ungu= biru ungu (indigo)
Merah+ ungu= merah ungu (crimson)
4. Warm
warna-warna yang hangat, contoh : merah, orange, kuning
5. Cool
warna-warna yang "dingin" gelap, contoh : hijau, biru, ungu
6. Neutral
6. Neutral
warna-warna yang bersifat netral, contoh : hitam, putih, abu-abu, coklat, beige and tan
7. Hue
7. Hue
warna itu sendiri
8. Chroma
8. Chroma
Kecerahan warna dengan perbandingan terhadap putih. Dalam desain jangan gunakan hue yang sama dengan chroma yang mirip. Tapi gunakan hue yang berbeda dengan chroma
9. Kode Warna HTML
9. Kode Warna HTML
| Warna/Color | Nama Warna | Hexadecimal | Desimal |
|---|---|---|---|
| 01. aliceblue | #f0f8ff | 240,248,255 | |
| 02. antiquewhite | #faebd7 | 250,235,215 | |
| 03 aqua | #00ffff | 0,255,255 | |
| 04. aquamarine | #7fffd4 | 127,255,212 | |
| 05. azure | #f0ffff | 240,255,255 | |
| 06. beige | #f5f5dc | 245,245,220 | |
| 07. bisque | #ffe4c4 | 255,228,196 | |
| 08. black | #000000 | 0,0,0 | |
| 09. blanchedalmond | #ffebcd | 255,235,205 | |
| 10. blue | #0000ff | 0,0,255 | |
| 11. blueviolet | #8a2be2 | 138,43,226 | |
| 12. brown | #a52a2a | 165,42,42 | |
| 13. burlywood | #deb887 | 222,184,135 | |
| 14. cadetblue | #5f9ea0 | 95,158,160 | |
| 15. chartreuse | #7fff00 | 127,255,0 | |
| 16. chocolate | #d2691e | 210,105,30 | |
| 17. coral | #ff7f50 | 255,127,80 | |
| 18. cornflowerblue | #6495ed | 100,149,237 | |
| 19. cornsilk | #fff8dc | 255,248,220 | |
| 20. crimson | #dc143c | 220,20,60 | |
| 21. cyan | #00ffff | 0,255,255 | |
| 22. darkblue | #00008b | 0,0,139 | |
| 23. darkcyan | #008b8b | 0,139,139 | |
| 24. darkgoldenrod | #b8860b | 184,134,11 | |
| 25. darkgray | #a9a9a9 | 169,169,169 | |
| 26. darkgreen | #006400 | 0,100,0 | |
| 27. darkgrey | #a9a9a9 | 169,169,169 | |
| 28. darkkhaki | #bdb76b | 189,183,107 | |
| 29. darkmagenta | #8b008b | 139,0,139 | |
| 30. darkolivegreen | #556b2f | 85,107,47 | |
| 31. darkorange | #ff8c00 | 255,140,0 | |
| 32. darkorchid | #9932cc | 153,50,204 | |
| 33. darkred | #8b0000 | 139,0,0 | |
| 34. darksalmon | #e9967a | 233,150,122 | |
| 35. darkseagreen | #8fbc8f | 143,188,143 | |
| 36. darkslateblue | #483d8b | 72,61,139 | |
| 37. darkslategray | #2f4f4f | 47,79,79 | |
| 38. darkslategrey | #2f4f4f | 47,79,79 | |
| 39. darkturquoise | #00ced1 | 0,206,209 | |
| 40. darkviolet | #9400d3 | 148,0,211 | |
| 41. deeppink | #ff1493 | 255,20,147 | |
| 42. deepskyblue | #00bfff | 0,191,255 | |
| 43. dimgray | #696969 | 105,105,105 | |
| 44. dimgrey | #696969 | 105,105,105 | |
| 45. dodgerblue | #1e90ff | 30,144,255 | |
| 46. firebrick | #b22222 | 178,34,34 | |
| 47. floralwhite | #fffaf0 | 255,250,240 | |
| 48. forestgreen | #228b22 | 34,139,34 | |
| 49. fuchsia | #ff00ff | 255,0,255 | |
| 50. gainsboro | #dcdcdc | 220,220,220 | |
| 51. ghostwhite | #f8f8ff | 248,248,255 | |
| 52. gold | #ffd700 | 255,215,0 | |
| 53. goldenrod | #daa520 | 218,165,32 | |
| 54. gray | #808080 | 128,128,128 | |
| 55. green | #008000 | 0,128,0 | |
| 56. greenyellow | #adff2f | 173,255,47 | |
| 57. grey | #808080 | 128,128,128 | |
| 58. honeydew | #f0fff0 | 240,255,240 | |
| 59. hotpink | #ff69b4 | 255,105,180 | |
| 60. indianred | #cd5c5c | 205,92,92 | |
| 61. indigo | #4b0082 | 75,0,130 | |
| 62. ivory | #fffff0 | 255,255,240 | |
| 63. khaki | #f0e68c | 240,230,140 | |
| 64. lavender | #e6e6fa | 230,230,250 | |
| 65. lavenderblush | #fff0f5 | 255,240,245 | |
| 66. lawngreen | #7cfc00 | 124,252,0 | |
| 67. lemonchiffon | #fffacd | 255,250,205 | |
| 68. lightblue | #add8e6 | 173,216,230 | |
| 69. lightcoral | #f08080 | 240,128,128 | |
| 70. lightcyan | #e0ffff | 224,255,255 | |
| 71. lightgoldenrodyellow | #fafad2 | 250,250,210 | |
| 72. lightgray | #d3d3d3 | 211,211,211 | |
| 73. lightgreen | #90ee90 | 144,238,144 | |
| 74. lightgrey | #d3d3d3 | 211,211,211 | |
| 75. lightpink | #ffb6c1 | 255,182,193 | |
| 76. lightsalmon | #ffa07a | 255,160,122 | |
| 77. lightseagreen | #20b2aa | 32,178,170 | |
| 78. lightskyblue | #87cefa | 135,206,250 | |
| 79. lightslategray | #778899 | 119,136,153 | |
| 80. lightslategrey | #778899 | 119,136,153 | |
| 81. lightsteelblue | #b0c4de | 176,196,222 | |
| 82. lightyellow | #ffffe0 | 255,255,224 | |
| 83. lime | #00ff00 | 0,255,0 | |
| 84. limegreen | #32cd32 | 50,205,50 | |
| 85. linen | #faf0e6 | 250,240,230 | |
| 86. magenta | #ff00ff | 255,0,255 | |
| 87. maroon | #800000 | 128,0,0 | |
| 88. mediumaquamarine | #66cdaa | 102,205,170 | |
| 89. mediumblue | #0000cd | 0,0,205 | |
| 90. mediumorchid | #ba55d3 | 186,85,211 | |
| 91. mediumpurple | #9370db | 147,112,219 | |
| 92. mediumseagreen | #3cb371 | 60,179,113 | |
| 93. mediumslateblue | #7b68ee | 123,104,238 | |
| 94. mediumspringgreen | #00fa9a | 0,250,154 | |
| 95. mediumturquoise | #48d1cc | 72,209,204 | |
| 96. mediumvioletred | #c71585 | 199,21,133 | |
| 97. midnightblue | #191970 | 25,25,112 | |
| 98. mintcream | #f5fffa | 245,255,250 | |
| 99. mistyrose | #ffe4e1 | 255,228,225 | |
| 100. moccasin | #ffe4b5 | 255,228,181 | |
| 101. navajowhite | #ffdead | 255,222,173 | |
| 102. navy | #000080 | 0,0,128 | |
| 103. oldlace | #fdf5e6 | 253,245,230 | |
| 104. olive | #808000 | 128,128,0 | |
| 105. olivedrab | #6b8e23 | 107,142,35 | |
| 106. orange | #ffa500 | 255,165,0 | |
| 107. orangered | #ff4500 | 255,69,0 | |
| 108. orchid | #da70d6 | 218,112,214 | |
| 109. palegoldenrod | #eee8aa | 238,232,170 | |
| 110. palegreen | #98fb98 | 152,251,152 | |
| 111. paleturquoise | #afeeee | 175,238,238 | |
| 112. palevioletred | #db7093 | 219,112,147 | |
| 113. papayawhip | #ffefd5 | 255,239,213 | |
| 114. peachpuff | #ffdab9 | 255,218,185 | |
| 115. peru | #cd853f | 205,133,63 | |
| 116. pink | #ffc0cb | 255,192,203 | |
| 117. plum | #dda0dd | 221,160,221 | |
| 118. powderblue | #b0e0e6 | 176,224,230 | |
| 119. purple | #800080 | 128,0,128 | |
| 120. red | #ff0000 | 255,0,0 | |
| 121. rosybrown | #bc8f8f | 188,143,143 | |
| 122. royalblue | #4169e1 | 65,105,225 | |
| 123. saddlebrown | #8b4513 | 139,69,19 | |
| 124. salmon | #fa8072 | 250,128,114 | |
| 125. sandybrown | #f4a460 | 244,164,96 | |
| 126. seagreen | #2e8b57 | 46,139,87 | |
| 127. seashell | #fff5ee | 255,245,238 | |
| 128. sienna | #a0522d | 160,82,45 | |
| 129. transparent | #c0c0c0 | 192,192,192 | |
| 130. skyblue | #87ceeb | 135,206,235 | |
| 131. slateblue | #6a5acd | 106,90,205 | |
| 132. slategray | #708090 | 112,128,144 | |
| 133. slategrey | #708090 | 112,128,144 | |
| 134. snow | #fffafa | 255,250,250 | |
| 135. springgreen | #00ff7f | 0,255,127 | |
| 136. steelblue | #4682b4 | 70,130,180 | |
| 137. tan | #d2b48c | 210,180,140 | |
| 138. teal | #008080 | 0,128,128 | |
| 139. thistle | #d8bfd8 | 216,191,216 | |
| 140. tomato | #ff6347 | 255,99,71 | |
| 141. turquoise | #40e0d0 | 64,224,208 | |
| 142. violet | #ee82ee | 238,130,238 | |
| 143. wheat | #f5deb3 | 245,222,179 | |
| 144.white | #ffffff | 255,255,255 | |
| 145. whitesmoke | #f5f5f5 | 245,245,245 | |
| 146. yellow | #ffff00 | 255,255,0 | |
| 147. yellowgreen | #9acd32 | 154,205,50 |
.
