Lila kod. HTML handledning. RGB-färger. Säkra palettfärger. CSS-färger - RGB-värden

Tabell (palett) med färger html ger dig möjlighet att självständigt välja den ton du behöver. Färgvärdet visas i tre format: Hex, RGB och HSV.

  • Hex består av tre tvåteckenvärden i det hexadecimala talsystemet. Till exempel: #ff00b3, där det första paret siffror är rött, det andra är grönt och det tredje är blått.
  • RGB (RedGreenBlue) har formen "200,100,255", vilket anger mängden motsvarande ton (röd, grön, blå) i den resulterande färgen.
  • HSV (Hue, Saturation, Value - tone, saturation, value) - en färgmodell där koordinaterna är:
    • Nyans - färgton, kan variera från 0° till 360°.
    • Saturation - saturation, varierar från 0-100 eller 0-1. Ju högre denna parameter är, desto "renare" blir färgen, varför denna parameter ibland kallas för färgrenhet. Och ju närmare denna parameter är noll, desto närmare är färgen neutral grå.
    • Värde (färgvärde) - ställer in ljusstyrkan, värdet kan även variera mellan 0-100 eller 0-1.

Ange färgkod: GÅ

Lista över färger med namn

Tabellen listar de engelska färgnamnen (som kan användas som värden) som stöds av alla webbläsare och deras hexadecimala värden. Alla färger som anges är "säkra", vilket innebär att de kommer att visas på samma sätt i alla webbläsare.

Färgnamn HEX Färg
Svart#000000
Marin#000080
Mörkblå#00008B
Mellanblå#0000CD
Blå#0000FF
Mörkgrön#006400
Grön#008000
Kricka#008080
Mörkcyan#008B8B
DeepSkyBlue#00BFFF
Mörkturkos#00CED1
MediumVårGrön#00FA9A
Kalk#00FF00
Vårgrön#00FF7F
Aqua#00FFFF
Cyan#00FFFF
Midnattsblå#191970
DodgerBlue#1E90FF
LjusSjögrön#20B2AA
Skog grön#228B22
Havsgrön#2E8B57
Mörkskiffergrå#2F4F4F
Limegrön#32CD32
MediumSeaGreen#3CB371
Turkos#40E0D0
Kungsblå#4169E1
Stålblå#4682B4
Mörkskifferblå#483D8B
MediumTurkos#48D1CC
Indigo#4B0082
MörkOlivgrön#556B2F
Kadettblå#5F9EA0
Blåklint Blå#6495ED
MediumAquaMarine#66CDAA
DimGrå#696969
SlateBlue#6A5ACD
OliveDrab#6B8E23
Skiffer grå#708090
Ljusskiffergrå#778899
MediumSlateBlå#7B68EE
Gräsgrön#7CFC00
Chartreuse#7FFF00
Akvamarin#7FFFD4
Rödbrun#800000
Lila#800080
Oliv#808000
grå#808080
Himmelsblå#87CEEB
LjusHimmelblå#87CEFA
Blåviolett#8A2BE2
Mörkröd#8B0000
DarkMagenta#8B008B
Sadelbrunt#8B4513
Mörkhavsgrön#8FBC8F
Ljusgrön#90EE90
MediumLila#9370D8
Mörkviolett#9400D3
Ljusgrön#98FB98
DarkOrchid#9932CC
Gulgrön#9ACD32
Sienna#A0522D
Brun#A52A2A
Mörkgrå#A9A9A9
Ljusblå#ADD8E6
Grön gul#ADFF2F
Blek turkos#AFEEEE
Ljusstålblå#B0C4DE
Puderblå#B0E0E6
Eldfast tegel#B22222
DarkGoldenRod#B8860B
MediumOrchid#BA55D3
RosyBrown#BC8F8F
Mörk Khaki#BDB76B
Silver#C0C0C0
MediumVioletRöd#C71585
IndianRött#CD5C5C
Peru#CD853F
Choklad#D2691E
Solbränna#D2B48C
Ljusgrå#D3D3D3
Blekviolettröd#D87093
Tistel#D8BFD8
Orkide#DA70D6
Gullris#DAA520
djupröd#DC143C
Gainsboro#DCDCDC
Plommon#DDA0DD
BurlyWood#DEB887
Ljuscyan#E0FFFF
Lavendel#E6E6FA
Mörklax#E9967A
Violett#EE82EE
PaleGoldenRod#EEE8AA
LightCoral#F08080
Kaki#F0E68C
AliceBlue#F0F8FF
HoneyDew#F0FFF0
Azurblå#F0FFFF
SandyBrown#F4A460
Vete#F5DEB3
Beige#F5F5DC
Vit rök#F5F5F5
MintCream#F5FFFA
GhostWhite#F8F8FF
Lax#FA8072
Antikvit#FAEBD7
Linné#FAF0E6
LjusGylleneRodGul#FAFAD2
Gammal spets#FDF5E6
Röd#FF0000
Fuchsia#FF00FF
Magenta#FF00FF
Deep Pink#FF1493
Orange röd#FF4500
Tomat#FF6347
Skrikrosa#FF69B4
Korall#FF7F50
Mörkorange#FF8C00
Ljuslax#FFA07A
Orange#FFA500
Ljusrosa#FFB6C1
Rosa#FFC0CB
Guld#FFD700
PeachPuff#FFDAB9
Navajovit#FFDEAD
Mockasin#FFE4B5
Bisque#FFE4C4
MistyRose#FFE4E1
Blancherad mandel#FFEBCD
PapayaWhip#FFEFD5
LavendelBlush#FFF0F5
Snäckskal#FFF5EE
Majssilke#FFF8DC
CitronChiffon#FFFACD
Blommigt Vit#FFFFAF0
Snö#FFFAFA
Gul#FFFF00
Ljusgul#FFFFE0
Elfenben#FFFFFF0
Vit#FFFFFF

HTML-färger indikeras med sex tecken efter snedstrecket - till exempel #000000. Dessa sex symboler representerar proportionerna mellan de olika färgerna (röd, grön, blå) i den slutliga färgen. På din datorskärm bildas bilden av ett stort antal punkter som kallas pixlar. Varje pixel är en liten ljuskälla, låt oss kalla det en "ficklampa", som i sin tur består av tre ficklampor - röda, gröna och blå. Genom att minska eller öka intensiteten på glöden hos individuella färgade ficklampor får vi den önskade färgen.

HTML färgkoder

Färger i HTML representeras av en hexadecimal (HEX) notation av rött, blått och grönt (RGB).

Det minsta färgvärdet är 0 (hexadecimalt 00). Det högsta färgvärdet är 255 (hex FF).

Det hexadecimala färgvärdet är tre siffror som börjar med #-tecknet.

Färgkoder (betydelser)

Färg HEX-kod RGB-kod
#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 miljoner nyanser

Att kombinera rött, blått och grönt med värden från 0 till 255 för varje färgs procentandel resulterar i totalt över 16 miljoner nyanser (256 x 256 x 256).

De flesta moderna bildskärmar kan visa minst 16 384 olika nyanser (LCD-skärmar kan i allmänhet visa 262 tusen 16 miljoner (uppdaterad oktober 2013) färger och CRT-skärmar kan visa ett praktiskt taget obegränsat antal färger).

Färgtabellen nedan visar förändringen i andelen rött från 0 till 255 med nollvärden för blått och grönt:

Röd HEX-kod RGB-kod
#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)

Nyanser av grått

För att få nyanser av grått används lika delar av alla färger. För att göra det lättare för dig att välja rätt färg förser vi dig med grå nyanskoder

Nyanser av grått HEX-kod RGB-kod
#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)

Cross-browser (alla webbläsare) HTML-färgnamn

En samling av 150 färgnamn i html, som stöds i alla webbläsare.

Standardiserade färgnamn

W3C listar 16 giltiga färgnamn för HTML och CSS: aqua, svart, blå, fuchsia, grå, grön, lime, rödbrun (kastanj), marin (ultramarin), oliv (oliv), lila (lila), röd (röd) , silver (silver), kricka (grå), vit (vit) och gul (gul).

När du använder färger som inte ingår i denna lista är det mer korrekt att använda deras hexadecimala (HEX) kod eller RGB-kod.

Säkra färger

För flera år sedan, när datorer kunde stödja maximalt 256 olika färger, föreslogs en lista med 216 "Web Safe Colors", med 40 färger reserverade för systemet.

Denna palett med 216 färger skapades för att korrekt visa färger i palettläget med 256 färger.

Nu spelar det ingen roll eftersom de flesta datorer runt om i världen har stöd för miljontals färgnyanser. Här är i alla fall en lista över dessa färger:

000000 000033 000066 000099 0000 CC 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 3300 CC 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 9900 CC 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

För HTML-sidor anges färger huvudsakligen i det hexadecimala systemet. För att göra detta används två typer av kodinspelning - fullständig eller förkortad. För att korrekt ange html-färgen i sin helhet måste du skriva sex tecken (siffror och/eller engelska bokstäver) efter hash-märket, till exempel skrivs svart så här: #000000. Stenografin för att ange html-färger består av en hash och tre siffror och/eller bokstäver bakom. Denna typ av lager kan dock endast användas om hela posten för en given färg består av identiska symboler efter hash-märket. Till exempel kan samma svarta färg skrivas så här: #000. Du kan ange html-färger med både stora och små tecken, eftersom de inte är skiftlägeskänsliga.

Varje tecken som skrivs efter "#" motsvarar en viss andel av färgerna rött, grönt och blått. I sin tur består alla monitorer av ett enormt antal pixlar (mikroskopiska prickar), som var och en inkluderar 3 så kallade "flashlights" (ljuskällor): röd, grön och blå. Sedan, genom att justera intensiteten på ljuset som sänds ut av dessa "ficklampor", visar monitorn den färg vi behöver.

Genom att kombinera emissionsintensiteten för rött, blått och grönt ljus (från 0 till 256) kan monitorer visa 16 000 000 olika nyanser.

Dessutom kan färger för webbplatser anges muntligt eller i RGB-kod.

Idag kan 147 färger skrivas muntligt. Det är viktigt att veta att vissa olika namn kan betyda samma färger, till exempel är Grå och Grå färgen grå (#808080).

Säkra färger för webbplatser.

Inte varje bildskärm och webbläsare kan korrekt visa alla 16 miljoner HTML-färger.

Om du till exempel stöter på en färg som webbläsaren inte kan visa korrekt, då:

  1. Webbläsaren ersätter den med den som är mest lik den och som kan reproduceras framgångsrikt;
  2. För att visa korrekt kan webbläsaren blanda flera färger och återge resultatet.

För att säkerställa att utdata i valfri webbläsare och på valfri bildskärm är den färg som du angav i koden, rekommenderas att använda "Safe Colors". De bestämdes inte manuellt eller av någon annans önskan, utan matematiskt. Det finns 216 sådana 100 % säkra färger för HTML-dokument. Och även om dagens teknik har nått den punkt där moderna bildskärmar och webbläsare känner igen miljontals nyanser, rekommenderar vi att du använder dessa säkra färger för att garantera färgåtergivning.

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

Den här tabellen innehåller 216 säkra html-färgkoder. Varje färg har ett värde i RGB för att ange färg i grafiska redigerare och HEX för att ange färg i HTML-sidor.

Hexadecimala tal används för att ange färger. Det hexadecimala systemet, till skillnad från decimalsystemet, bygger, som namnet antyder, på talet 16. Siffrorna kommer att vara följande: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Siffror från 10 till 15 ersätts med latinska bokstäver. Tal större än 15 i det hexadecimala systemet bildas genom att kombinera två tal till ett. Till exempel motsvarar talet 255 i decimal talet FF i hexadecimal. För att undvika förvirring vid bestämning av talsystemet placeras en hash-symbol # före det hexadecimala talet, till exempel #666999. Var och en av de tre färgerna - röd, grön och blå - kan ta värden från 00 till FF. Färgsymbolen är alltså uppdelad i tre komponenter #rrggbb, där de två första symbolerna indikerar färgens röda komponent, de två mittersta - grönt och de två sista - blått. Det är tillåtet att använda den förkortade formen #rgb, där varje tecken ska dubblas. Därför bör posten #fe0 betraktas som #ffee00.

Vid namn

Internet Explorer Krom Opera Safari Firefox Android iOS
4.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

Webbläsare stöder vissa färger efter deras namn. I tabell 1 visar namn, hexadecimal kod, RGB, HSL-värden och beskrivning.

Tabell 1. Namn på färger
namn Färg Koda RGB HSL Beskrivning
vit #ffffff eller #fff rgb(255,255,255) hsl(0,0 %, 100 %) Vit
silver #c0c0c0 rgb(192,192,192) hsl(0,0%,75%) Grå
grå #808080 rgb(128,128,128) hsl(0,0%,50%) Mörkgrå
svart #000000 eller #000 rgb(0,0,0) hsl(0,0%,0%) Svart
rödbrun #800000 rgb(128,0,0) hsl(0,100%,25%) Mörkröd
röd #ff0000 eller #f00 rgb(255,0,0) hsl(0,100%,50%) Röd
orange #ffa500 rgb(255,165,0) hsl(38,8,100%,50%) Orange
gul #ffff00 eller #ff0 rgb(255,255,0) hsl(60,100%,50%) Gul
oliv #808000 rgb(128,128,0) hsl(60,100%,25%) Oliv
kalk #00ff00 eller #0f0 rgb(0,255,0) hsl(120,100%,50%) Ljusgrön
grön #008000 rgb(0,128,0) hsl(120,100%,25%) Grön
aqua #00ffff eller #0ff rgb(0,255,255) hsl(180,100%,50%) Blå
blå #0000ff eller #00f rgb(0,0,255) hsl(240,100%,50%) Blå
Marin #000080 rgb(0,0,128) hsl(240,100%,25%) Mörkblå
kricka #008080 rgb(0,128,128) hsl(180,100%,25%) Blå grön
fuchsia #ff00ff eller #f0f rgb(255,0,255) hsl(300,100%,50%) Rosa
lila #800080 rgb(128,0,128) hsl(300,100%,25%) Violett

Använder RGB

Internet Explorer Krom Opera Safari Firefox Android iOS
5.0+ 1.0+ 3.5+ 1.3+ 1.0+ 1.0+ 1.0+

Du kan definiera färg med de röda, gröna och blå värdena i decimaler. Var och en av de tre färgkomponenterna har ett värde från 0 till 255. Det är också tillåtet att ange färgen i procent, med 100 % motsvarande siffran 255. Ange först nyckelordet rgb och ange sedan färgkomponenterna inom parentes , separerade med kommatecken, till exempel rgb(255, 128, 128) eller rgb(100%, 50%, 50%).

RGBA

Internet Explorer Krom Opera Safari Firefox Android iOS
9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

RGBA-formatet liknar syntaxen RGB, men innehåller en alfakanal som anger elementets transparens. Ett värde på 0 är helt transparent, 1 är ogenomskinligt och ett mellanvärde som 0,5 är halvtransparent.

RGBA lades till i CSS3, så CSS-koden måste valideras mot denna version. Det bör noteras att CSS3-standarden fortfarande är under utveckling och vissa funktioner kan ändras. Till exempel valideras en färg i RGB-format som lagts till i egenskapen bakgrundsfärg, men en som läggs till egenskapen bakgrund är inte längre giltig. Samtidigt förstår webbläsare helt korrekt färgen för båda egenskaperna.

HSL

Internet Explorer Krom Opera Safari Firefox Android iOS
9.0+ 1.0+ 9.6+ 3.1+ 3.0+ 2.1+ 2.0+

Namnet på HSL-formatet kommer från kombinationen av de första bokstäverna Hue (nyans), Saturate (mättnad) och Lightness (ljushet). Nyans är färgvärdet på färghjulet (fig. 1) och anges i grader. 0° motsvarar rött, 120° grönt och 240° blått. Nyansvärdet kan variera från 0 till 359.

Ris. 1. Färghjul

Mättnad är intensiteten hos en färg och mäts i procent från 0 % till 100 %. Ett värde på 0 % indikerar ingen färg och en grå nyans, 100 % är maxvärdet för mättnad.

Ljushet anger hur ljus färgen är och anges i procent från 0 % till 100 %. Låga värden gör färgen mörkare och höga värden gör färgen ljusare; extrema värden på 0% och 100% motsvarar svart och vitt.

HSLA

Internet Explorer Krom Opera Safari Firefox Android iOS
9.0+ 1.0+ 10.0+ 3.1+ 3.0+ 2.1+ 2.0+

HSLA-formatet liknar syntaxen HSL, men innehåller en alfakanal för att specificera elementets transparens. Ett värde på 0 är helt transparent, 1 är ogenomskinligt och ett mellanvärde som 0,5 är halvtransparent.

RGBA-, HSL- och HSLA-färgvärden läggs till i CSS3, så kontrollera din kod för versionsgiltighet när du använder dessa format.

HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx

Färger

Varning

Alla lejonfångstmetoder som listas på webbplatsen är teoretiska och baserade på beräkningsmetoder. Författarna garanterar inte din säkerhet när du använder dem och frånsäger sig allt ansvar för resultaten. Kom ihåg att ett lejon är ett rovdjur och ett farligt djur!

Arrrgh!

Resultatet av detta exempel visas i fig. 2.

Ris. 2. Färger på webbsidan

Det finns flera sätt att representera färg i webbdesign.

HEX är ett hexadecimalt färgrepresentationssystem baserat på bas 16. För detta system används arabiska decimalsiffror från 0 till 9 och latinska bokstäver från A till F för att komplettera det digitala numret till 16. För webbdesign, 16 primära (nyckel) färger används, den så kallade hexadecimala färgkoden #RRGGBB, där varje par står för sin andel av färgen: RR – röd, GG – grön och BB – blå. Varje färgfraktion sträcker sig från 00 till FF.

Två andra representationer av färg i webbdesign är: i form av RGB(*,*,*), där varje "*" bråkdel av en färg representeras av decimalsiffror från 0 till 255 och av färgnamn på engelska.

När du skapar en färgbild är huvudproblemet korrekt återgivning av färger på olika typer av datorer, bildskärmar och webbläsare. Om webbläsaren inte kan visa en färg korrekt väljer den en liknande eller blandar flera färger. Och ibland kan den ersättas med någon helt annan färg.

Tabell 16 grundfärger, som används i alla webbläsare

namn Färg Hex (RGB)
Aqua (havsvåg) #00FFFF (000,255,255)
Svart #000000 (000,000,000)
Blå #0000FF (000,000,255)
Fuchsia (magenta) #FF00FF (255,000,255)
grå #808080 (128,128,128)
Grön #008000 (000,128,000)
Lime (ljusgrön) #00FF00 (000,255,000)
Rödbrun (mörk vinröd) #800000 (128,000,000)
Marinblå (mörkblå) #000080 (000,000,128)
Oliv #808000 (128,128,000)
Lila #800080 (128,000,128)
Röd #FF0000 (255,000,000)
Silver #C0C0C0 (192,192,192)
kricka (grågrön) #008080 (000,128,128)
Vit #FFFFFF (255,255,255)
Gul #FFFF00 (255,255,000)

Tabell lila färger och dess nyanser

namn Färg Hex (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 lila) #EF0097 (239,000,151)
Laxrosa (orange rosa) #FF91A4 (255,145,164)
Cenise (en nyans av lila) #DE3163 (153,149,140)
Aubergine aubergine (aubergine) #990066 (153,000,132)
Lavendelrouge (rosa-lavendel)  #FFF0F5 (255,240,245)
Lila (lila) #C8A2C8 (200,162,200)
Magenta (magenta) #FF008F (255,000,143)
Orkidé (orkidé) #DA70D6 (218,112,214)
Röd-violett (lila-röd) #C71585 (199,021,133)
Sanguine (sanguine) #92000A (146,000,010)
tistel (nyans av lila) #D8BFD8 (185,211,238)
Violett-aubergine (en nyans av lila) #991199 (153,017,153)
Rosa vivo (djupt rosa) #FF007F (255,000,127)
Lavendel-rosa (en nyans av lila) #FBA0E3 (108,123,139)
Mountbatten rosa #997ABD (153,122,141)

Tabell grå färger och dess nyanser

namn Färg Hex (RGB)
grå #808080 (128,128,128)
grå #bebebe (190,190,190)
(Grå nyans) #858585 (133,133,133)
Grå33 #545454 (084,084,084)
(Grå skiffer) #708090 (112,128,144)
(Kvarts) #99958с (153,149,140)
(Ljusgrå) #bbbbbb (187,187,187)
(Silver) #c0c0c0 (192,192,192)
(Grå-vit) #f0f0f0 (240,240,240)
(Abdel-Kerims skägg) #e0e0e0 (224,224,224)
Ljusgrå (Ljusgrå) #d3d3d3 (211,211,211)
LightStateGray() #778899 (119,136,153)
StateGray-1 (blek blåklintblå1) #c6e2ff (198,226,255)
StateGray-2 (blek blåklintblå2) #b9d3ee (185,211,238)
StateGray3() #9fb6cd (159,182,205)
StateGray4() #6c7b8b (108,123,139)