Tabel warna css bernama. tutorial HTML. warna RGB. Warna palet yang aman. Menggunakan palet warna yang aman




Ada beberapa cara untuk merepresentasikan warna dalam desain web.

HEX adalah sistem representasi warna heksadesimal berdasarkan basis 16. Untuk sistem ini, angka desimal Arab dari 0 hingga 9 dan huruf Latin dari A hingga F digunakan untuk melengkapi angka digital ke 16. Untuk desain web, 16 warna primer (kunci) digunakan, yang disebut kode warna heksadesimal #RRGGBB, di mana setiap pasangan bertanggung jawab atas pembagian warnanya: RR – merah, GG – hijau dan BB – biru. Setiap fraksi warna berkisar dari 00 hingga FF.

Dua representasi warna lainnya dalam desain web adalah: dalam bentuk RGB(*,*,*), di mana setiap pecahan “*” suatu warna diwakili oleh angka desimal dari 0 hingga 255 dan dengan nama warna dalam bahasa Inggris.

Saat membuat gambar berwarna, masalah utamanya adalah reproduksi warna yang benar pada berbagai jenis komputer, monitor, dan browser. Jika browser tidak dapat menampilkan warna dengan benar, browser akan memilih warna serupa atau mencampur beberapa warna. Dan terkadang bisa diganti dengan warna yang sama sekali berbeda.

Meja 16 warna primer, yang digunakan di semua browser

Nama Warna kutukan (RGB)
Aqua (gelombang laut) #00FFFF (000,255,255)
Hitam #000000 (000,000,000)
Biru #0000FF (000,000,255)
Fuchsia (magenta) #FF00FF (255,000,255)
Abu-abu #808080 (128,128,128)
Hijau #008000 (000,128,000)
Jeruk nipis (hijau cerah) #00FF00 (000,255,000)
Maroon (merah anggur tua) #800000 (128,000,000)
Angkatan Laut (biru tua) #000080 (000,000,128)
Zaitun #808000 (128,128,000)
Ungu #800080 (128,000,128)
Merah #FF0000 (255,000,000)
Perak #C0C0C0 (192,192,192)
Teal (abu-abu kehijauan) #008080 (000,128,128)
Putih #FFFFFF (255,255,255)
Kuning #FFFF00 (255,255,000)

Meja ungu warna dan coraknya

Nama Warna kutukan (RGB)
Magenta (magenta) #FFCBDB (255,203,219)
Magenta (magenta) #FF0099 (255,000,153)
Magenta (magenta) #F95A61 (249,090,097)
Fuchsia (fuchsia) #FF00FF (255,000,255)
Mauvein (anilin ungu) #EF0097 (239,000,151)
Salmon merah muda (oranye merah muda) #FF91A4 (255,145,164)
Cenise (warna ungu) #DE3163 (153,149,140)
Terong Terong (terong) #990066 (153,000,132)
Perona pipi lavender (lavender merah muda)  #FFF0F5 (255,240,245)
Ungu (ungu) #C8A2C8 (200,162,200)
Magenta (magenta) #FF008F (255,000,143)
Anggrek (anggrek) #DA70D6 (218,112,214)
Merah-ungu (ungu-merah) #C71585 (199,021,133)
Sanguin (optimis) #92000A (146,000,010)
Thistle (warna ungu) #D8BFD8 (185,211,238)
Terong ungu (warna ungu) #991199 (153,017,153)
Rosa vivo (merah muda tua) #FF007F (255,000,127)
Lavender-rose (warna ungu) #FBA0E3 (108,123,139)
Gunungbatten berwarna merah muda #997ABD (153,122,141)

Meja abu-abu warna dan coraknya

Nama Warna kutukan (RGB)
Abu-abu #808080 (128,128,128)
Abu-abu #bebebe (190,190,190)
(Warna abu-abu) #858585 (133,133,133)
abu-abu33 #545454 (084,084,084)
(Batu tulis abu-abu) #708090 (112,128,144)
(Kuarsa) #99958с (153,149,140)
(Abu-abu muda) #bbbbbb (187,187,187)
(Perak) #c0c0c0 (192,192,192)
(Abu-putih) #f0f0f0 (240,240,240)
(Jenggot Abdel-Kerim) #e0e0e0 (224,224,224)
Abu-abu Muda (Abu-abu muda) #d3d3d3 (211,211,211)
LightStateGrey() #778899 (119,136,153)
StateGray-1 (Biru jagung pucat1) #c6e2ff (198,226,255)
StateGray-2 (Biru jagung pucat2) #b9d3ee (185,211,238)
NegaraGray3() #9fb6cd (159,182,205)
NegaraGray4() #6c7b8b (108,123,139)

warna HTML
Warna HTML dan cara menentukannya

Dalam HTML, ada dua cara untuk menentukan warna:

1. Menggunakan nama warna,
2. Menggunakan sistem RGB, dimana warna ditentukan dalam format heksadesimal.

Nama warna

Nama warna dalam HTML ditunjukkan dengan kata-kata bahasa Inggris, seperti merah atau hijau. Nama warna bertindak sebagai nilai atribut tag HTML. Nama bunganya banyak sekali, pada artikel kali ini kita hanya akan membahas yang utama saja.

Biasanya, dua atribut digunakan dalam HTML untuk mengatur warna:

1. Atribut color="color_name" - warna teks,
2. Atribut bgcolor="color_name" - warna latar belakang.

Contoh penggunaan atribut warna:
color="red" - memberi warna merah pada teks,
bgcolor="green" - memberi warna hijau pada latar belakang.

Tabel nama warna HTML dasar:

Nama warna Penampilannya Terjemahan
putih Putih
gading Gading
perak Perak
abu-abu Abu-abu
hitam Hitam
merah tua Merah tua
merah Merah
oranye Oranye
emas Emas
kuning Kuning
Zaitun Zaitun
jeruk nipis jeruk nipis
hijau Hijau
air Ombak laut
biru Biru
angkatan laut Navi
teal Pirus
fuchsia ungu
ungu Ungu

Sistem bilangan heksadesimal

Dalam kehidupan sehari-hari, kita menggunakan sistem bilangan desimal dari 0 sampai 9. Pemrogram dan desainer sering menggunakan sistem bilangan heksadesimal dari 0 hingga 15, dimana:

10 = SEBUAH
11 =B
12 = C
13 =D
14 = E
15 = F

Hampir setiap warna dan bayangan yang terlihat oleh penglihatan kita dapat ditulis dalam sistem heksadesimal, misalnya warna merah merah dalam sistem heksadesimal akan sama dengan ff0000

color="red" - warna merah, berdasarkan nama,
color="#ff0000" — warna merah, dalam sistem bilangan heksadesimal.

Dalam HTML, angka heksadesimal diawali dengan tanda pagar # pada nilai atribut.

RGB

Sebelum Anda mulai menentukan warna dalam HTML menggunakan sistem bilangan heksadesimal, Anda harus terlebih dahulu mempelajari hal seperti R G B

RGB merupakan singkatan dari kata R ed G reen B lue (Merah Hijau Biru).

Suatu warna dalam HTML, ditulis dalam heksadesimal, terdiri dari tiga blok angka 00 00 00, dimana setiap blok bertanggung jawab atas salah satu warna RGB, blok pertama untuk merah, blok kedua untuk hijau, dan blok ketiga untuk biru. Angka dapat berkisar dari 00 hingga ff.

Dimana, ff adalah 255 dalam notasi desimal.

Skema RGB:
Merah - dari 00 hingga seterusnya
Hijau - dari 00 hingga seterusnya
Biru - dari 00 hingga seterusnya

Hasilnya, kita mendapatkan enam digit angka 000000, dengan dua angka pertama untuk warna merah, dua angka kedua untuk warna hijau, dan dua angka ketiga untuk warna biru.

Jika kita ingin mendapatkan warna merah, maka kita tulis ff0000, warna hijau 00ff00, warna biru 0000ff. Misalnya kita ingin mendapatkan warna merah tua, maka kita perlu mengurangi blok angka pertama dan bukannya ff (yang sama dengan 255 dalam sistem bilangan desimal), tulis misalnya 96 (yang sama dengan 150 dalam notasi desimal).

Agar lebih jelas, kami berikan contoh warna dan kode heksadesimalnya:

Mencampur warna dalam HTML

Jika Anda tidak melewatkan kelas menggambar di sekolah, Anda mungkin ingat bahwa dengan mencampurkan warna merah dan hijau secara merata, Anda bisa mendapatkan warna kuning,
ketika Anda menambahkan sedikit hijau ke merah Anda bisa mendapatkan oranye, dll.

Warna heksadesimal dan RGB juga dapat dicampur:

Dengan bereksperimen dengan sistem bilangan heksadesimal dan RGB, pada akhirnya Anda akan terbiasa dan dapat memilih warna yang Anda inginkan.

Dalam HTML, warna dapat ditentukan dengan tiga cara:

Mengatur warna dalam HTML berdasarkan namanya

Beberapa warna dapat ditentukan berdasarkan namanya, menggunakan nama warna dalam bahasa Inggris sebagai nilainya. Kata kunci yang paling umum: hitam, putih, merah, hijau, biru, dll.:

Warna teks – merah

Warna paling populer dari standar World Wide Web Consortium (W3C):

WarnaNamaWarnaNama WarnaNama WarnaNama
Hitam Abu-abu Perak Putih
Kuning jeruk nipis air fuchsia
Merah Hijau Biru Ungu
Merah tua Zaitun Angkatan laut teal

Contoh penggunaan nama warna yang berbeda:

Contoh: menentukan warna berdasarkan namanya

  • Cobalah sendiri "

Tajuk di latar belakang merah

Header pada latar belakang oranye

Menuju latar belakang kapur

Teks putih dengan latar belakang biru

Tajuk di latar belakang merah

Header pada latar belakang oranye

Menuju latar belakang kapur

Teks putih dengan latar belakang biru

Menentukan Warna Menggunakan RGB

Saat menampilkan warna berbeda pada monitor, palet RGB digunakan sebagai dasar. Warna apa pun diperoleh dengan mencampurkan tiga warna dasar: R - merah, G - hijau, B - biru. Kecerahan setiap warna diberikan oleh satu byte dan oleh karena itu dapat mengambil nilai dari 0 hingga 255. Misalnya, RGB(255,0,0) ditampilkan sebagai merah karena merah disetel ke nilai tertinggi (255) dan sisanya diatur ke 0 Anda juga dapat mengatur warna sebagai persentase. Setiap parameter menunjukkan tingkat kecerahan warna yang sesuai. Misalnya: nilai rgb(127, 255, 127) dan rgb(50%, 100%, 50%) akan menetapkan warna hijau sedang yang sama:

Contoh : Menentukan Warna Menggunakan RGB

  • Cobalah sendiri "

rgb(127, 255, 127)

RGB(50%, 100%, 50%)

rgb(127, 255, 127)

RGB(50%, 100%, 50%)

Atur warna berdasarkan nilai heksadesimal

Nilai-nilai R G B juga dapat ditentukan menggunakan nilai warna heksadesimal (HEX) dalam bentuk: #RRGGBB dimana RR (merah), GG (hijau) dan BB (biru) adalah nilai heksadesimal dari 00 hingga FF (sama dengan desimal 0-255 ) . Sistem heksadesimal, tidak seperti sistem desimal, seperti namanya, didasarkan pada angka 16. Sistem heksadesimal menggunakan tanda-tanda berikut: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Di sini angka 10 sampai 15 diganti dengan huruf latin. Angka yang lebih besar dari 15 dalam sistem heksadesimal direpresentasikan dengan menggabungkan dua karakter menjadi satu nilai. Misalnya, angka tertinggi 255 dalam desimal sama dengan nilai FF tertinggi dalam heksadesimal. Berbeda dengan sistem desimal, bilangan heksadesimal diawali dengan simbol hash. # , misalnya, #FF0000 ditampilkan dengan warna merah karena warna merah disetel ke nilai tertingginya (FF) dan warna lainnya disetel ke nilai minimumnya (00). Tanda setelah simbol hash # Anda dapat mengetikkan huruf besar dan kecil. Sistem heksadesimal memungkinkan Anda menggunakan bentuk singkatan #rgb, di mana setiap karakter setara dengan dua kali lipat. Oleh karena itu, entri #f7O seharusnya dianggap sebagai #ff7700.

Contoh: Warna HEX

  • Cobalah sendiri "

merah: #FF0000

hijau: #00FF00

biru: #0000FF

merah: #FF0000

hijau: #00FF00

biru: #0000FF

merah+hijau=kuning: #FFFF00

merah+biru=ungu: #FF00FF

hijau+biru=sian: #00FFFF

Daftar warna yang umum digunakan (nama, HEX dan RGB):

nama Inggris nama Rusia Sampel HEX RGB
bayam bayam #E52B50 229 43 80
Amber Amber #FFBF00 255 191 0
air Biru hijau #00FFFF 0 255 255
Biru langit Biru langit #007FFF 0 127 255
Hitam Hitam #000000 0 0 0
Biru Biru #0000FF 0 0 255
Bondi Biru Air pantai Bondi #0095B6 0 149 182
Kuningan Kuningan #B5A642 181 166 66
Cokelat Cokelat #964B00 150 75 0
Berwarna biru langit Biru langit #007BA7 0 123 167
Hijau musim semi yang gelap Hijau musim semi yang gelap #177245 23 114 69
Zamrud Zamrud #50C878 80 200 120
Terong Terong #990066 153 0 102
fuchsia fuchsia #FF00FF 255 0 255
Emas Emas #FFD700 250 215 0
Abu-abu Abu-abu #808080 128 128 128
Hijau Hijau #00FF00 0 255 0
Nila Nila #4B0082 75 0 130
Giok Giok #00A86B 0 168 107
jeruk nipis jeruk nipis #CCFF00 204 255 0
perunggu perunggu #0BDA51 11 218 81
Angkatan laut Biru tua #000080 0 0 128
Oker Oker #CC7722 204 119 34
Zaitun Zaitun #808000 128 128 0
Oranye Oranye #FFA500 255 165 0
Persik Persik #FFE5B4 255 229 180
Labu Labu #FF7518 255 117 24
Ungu Ungu #800080 128 0 128
Merah Merah #FF0000 255 0 0
Kunyit Kunyit #F4C430 244 196 48
Laut hijau Laut hijau #2E8B57 46 139 87
Rawa hijau Bolotny #ACB78E 172 183 142
teal Biru hijau #008080 0 128 128
Biru laut Biru laut #120A8F 18 10 143
Ungu Ungu #8B00FF 139 0 255
Kuning Kuning #FFFF00 255 255 0

Kode warna (latar belakang) berdasarkan saturasi dan rona.

Warna HTML ditunjukkan dengan enam karakter setelah karakter garis miring - misalnya, #000000. Keenam simbol ini mewakili proporsi warna berbeda (Merah, Hijau, Biru) pada warna akhir. Di monitor komputer Anda, gambar terbentuk dari sejumlah besar titik yang disebut piksel. Setiap piksel adalah sumber cahaya kecil, sebut saja "senter", yang terdiri dari tiga senter - merah, hijau, dan biru. Dengan mengurangi atau meningkatkan intensitas cahaya senter berwarna, kita mendapatkan warna yang diinginkan.

Kode warna HTML

Warna dalam HTML diwakili oleh notasi heksadesimal (HEX) merah, biru, dan hijau (RGB).

Nilai warna terkecil adalah 0 (heksadesimal 00). Nilai warna tertinggi adalah 255 (hex FF).

Nilai warna heksadesimal adalah tiga digit yang dimulai dengan tanda #.

Kode warna (arti)

Warna kode HEX kode RGB
#000000 rgb(0,0,0)
#FF0000 rgb(255,0,0)
#00FF00 rgb(0,255,0)
#0000FF rgb(0,0,255)
#FFFF00 rgb(255.255,0)
#00FFFF rgb(0,255,255)
#FF00FF rgb(255,0,255)
#C0C0C0 rgb(192.192.192)
#FFFFFF rgb(255.255.255)

16 juta warna

Menggabungkan warna merah, biru, dan hijau dengan nilai berkisar antara 0 hingga 255 untuk persentase setiap warna menghasilkan total lebih dari 16 juta corak (256 x 256 x 256).

Kebanyakan monitor modern mampu menampilkan setidaknya 16.384 warna berbeda (monitor LCD umumnya mampu menampilkan 262 ribu 16 juta warna). (diperbarui Oktober 2013) warna, dan monitor CRT dapat menampilkan jumlah warna yang hampir tidak terbatas).

Tabel warna di bawah ini menunjukkan perubahan proporsi warna merah dari 0 menjadi 255 dengan nilai nol untuk biru dan hijau:

Merah kode HEX kode RGB
#000000 rgb(0,0,0)
#080000 rgb(8,0,0)
#100000 rgb(16,0,0)
#180000 rgb(24,0,0)
#200000 rgb(32,0,0)
#280000 rgb(40,0,0)
#300000 rgb(48,0,0)
#380000 rgb(56,0,0)
#400000 rgb(64,0,0)
#480000 rgb(72,0,0)
#500000 rgb(80,0,0)
#580000 rgb(88,0,0)
#600000 rgb(96,0,0)
#680000 rgb(104,0,0)
#700000 rgb(112,0,0)
#780000 rgb(120,0,0)
#800000 rgb(128,0,0)
#880000 rgb(136,0,0)
#900000 rgb(144,0,0)
#980000 rgb(152,0,0)
#A00000 rgb(160,0,0)
#A80000 rgb(168,0,0)
#B00000 rgb(176,0,0)
#B80000 rgb(184,0,0)
#C00000 rgb(192,0,0)
#C80000 rgb(200,0,0)
#D00000 rgb(208,0,0)
#D80000 rgb(216,0,0)
#E00000 rgb(224,0,0)
#E80000 rgb(232,0,0)
#F00000 rgb(240,0,0)
#F80000 rgb(248,0,0)
#FF0000 rgb(255,0,0)

Bayangan abu-abu

Untuk mendapatkan corak abu-abu, digunakan bagian yang sama dari semua warna. Untuk memudahkan Anda memilih warna yang tepat, kami menyediakan kode warna abu-abu

Bayangan abu-abu kode HEX kode RGB
#000000 rgb(0,0,0)
#080808 RGB(8,8,8)
#101010 rgb(16,16,16)
#181818 rgb(24,24,24)
#202020 rgb(32,32,32)
#282828 rgb(40,40,40)
#303030 rgb(48,48,48)
#383838 rgb(56,56,56)
#404040 rgb(64,64,64)
#484848 rgb(72,72,72)
#505050 rgb(80,80,80)
#585858 rgb(88,88,88)
#606060 rgb(96,96,96)
#686868 rgb(104.104.104)
#707070 rgb(112.112.112)
#787878 rgb(120,120,120)
#808080 rgb(128.128.128)
#888888 rgb(136.136.136)
#909090 rgb(144.144.144)
#989898 rgb(152.152.152)
#A0A0A0 rgb(160.160.160)
#A8A8A8 rgb(168.168.168)
#B0B0B0 rgb(176.176.176)
#B8B8B8 rgb(184.184.184)
#C0C0C0 rgb(192.192.192)
#C8C8C8 rgb(200.200.200)
#D0D0D0 rgb(208.208.208)
#D8D8D8 rgb(216.216.216)
#E0E0E0 rgb(224.224.224)
#E8E8E8 rgb(232.232.232)
#F0F0F0 rgb(240.240.240)
#F8F8F8 rgb(248.248.248)
#FFFFFF rgb(255.255.255)

Nama warna html lintas browser (semua browser).

Kumpulan 150 nama warna dalam html, didukung di semua browser.

Nama warna standar

W3C mencantumkan 16 nama warna yang valid untuk HTML dan CSS: aqua, hitam, biru, fuchsia, abu-abu, hijau, kapur, merah marun (chestnut), angkatan laut (ultramarine), zaitun (zaitun), ungu (ungu), merah (merah) , perak (silver), teal (abu-abu), putih (putih) dan kuning (kuning).

Jika menggunakan warna yang tidak termasuk dalam daftar ini, lebih tepat menggunakan kode heksadesimal (HEX) atau kode RGB.

Warna yang aman

Beberapa tahun yang lalu, ketika komputer dapat mendukung maksimal 256 warna berbeda, daftar 216 "Warna Aman Web" diusulkan, dengan 40 warna dicadangkan untuk sistem.

Palet 216 warna ini dibuat untuk menampilkan warna dengan benar dalam mode palet 256 warna.

Sekarang hal ini tidak menjadi masalah karena sebagian besar komputer di seluruh dunia mendukung jutaan corak warna. Bagaimanapun, berikut adalah daftar warna-warna ini:

000000 000033 000066 000099 0000CC 0000FF
003300 003333 003366 003399 0033CC 0033FF
006600 006633 006666 006699 0066CC 0066FF
009900 009933 009966 009999 0099CC 0099FF
00CC00 00CC33 00CC66 00CC99 00CCCC 00CCFF
00FF00 00FF33 00FF66 00FF99 00FFCC 00FFFF
330000 330033 330066 330099 3300CC 3300FF
333300 333333 333366 333399 3333CC 3333FF
336600 336633 336666 336699 3366CC 3366FF
339900 339933 339966 339999 3399CC 3399FF
33CC00 33CC33 33CC66 33CC99 33CCCC 33CCFF
33FF00 33FF33 33FF66 33FF99 33FFCC 33FFFF
660000 660033 660066 660099 6600CC 6600FF
663300 663333 663366 663399 6633CC 6633FF
666600 666633 666666 666699 6666CC 6666FF
669900 669933 669966 669999 6699CC 6699FF
66CC00 66CC33 66CC66 66CC99 66CCCC 66CCFF
66FF00 66FF33 66FF66 66FF99 66FFCC 66FFFF
990000 990033 990066 990099 9900CC 9900FF
993300 993333 993366 993399 9933CC 9933FF
996600 996633 996666 996699 9966CC 9966FF
999900 999933 999966 999999 9999CC 9999FF
99CC00 99CC33 99CC66 99CC99 99CCCC 99CCFF
99FF00 99FF33 99FF66 99FF99 99FFCC 99FFFF
CC0000 CC0033 CC0066 CC0099 CC00CC CC00FF
CC3300 CC3333 CC3366 CC3399 CC33CC CC33FF
CC6600 CC6633 CC6666 CC6699 CC66CC CC66FF
CC9900 CC9933 CC9966 CC9999 CC99CC CC99FF
CCCC00 CCCC33 CCCC66 CCCC99 CCCCCC CCCCFF
CCFF00 CCFF33 CCFF66 CCFF99 CCFFCC CCFFFF
FF0000 FF0033 FF0066 FF0099 FF00CC FF00FF
FF3300 FF3333 FF3366 FF3399 FF33CC FF33FF
FF6600 FF6633 FF6666 FF6699 FF66CC FF66FF
FF9900 FF9933 FF9966 FF9999 FF99CC FF99FF
FFCC00 FFCC33 FFCC66 FFCC99 FFCCCC FFCCFF
FFFF00 FFFF33 FFFF66 FFFF99 FFFFCC FFFFFF