Overzicht van de belangrijkste HTML-kleurcodes
Bij het maken van een website is het handig een overzicht van alle HTML-kleurcodes bij de hand te hebben. In HTML-taal kunnen de meest voorkomende kleuren eenvoudig worden aangeduid met “green” of “yellow”, maar de resterende van in totaal ruim 16 miljoen kleuren kunnen natuurlijk niet allemaal met een Engelse kleurennaam worden aangeduid. Dit kan wel met de zogenaamde hexadecimale getallen als FFFFFF of 000000, deze hexadecimale getallen worden dan ook veel gebruikt. Een uitleg over de werking van hexadecimale kleurcodes en een overzicht van 150 veelgebruikte kleuren.
Wat zijn hexadecimale getallen?
Een normaal getal loopt van 0 tot en met 9, dat zijn in totaal tien tekens. Een hexadecimaal getal loopt van 0 tot en met 9 en vervolgens van A tot en met F, dat zijn in totaal 16 tekens. Bij het aanduiden van kleuren op de computer worden reeksen van 6 hexadecimale getallen gebruikt. De eerste twee posities geven de rode kleuren aan, de volgende twee posities geven de groene kleuren aan, en de laatste twee posities de blauwe kleuren. De kleuren zijn dus opgebouwd volgens RGB kleuren (rood, groen, blauw), waarbij elk van deze drie kleuren 256 mogelijkheden kent (16x16).
Als een hexadecimaal getal 0 betreft, dan is de waarde 0%, is deze een F, dan is de kleurwaarde maximaal en is deze 100%. In de hexadecimale kleurcode FFFFFF staan zowel de rode, de groene, als de blauwe kleuren op hun allerfelst, dit resulteert in de kleur wit. Het is dus eenvoudig te begrijpen dat de kleurcode 000000 de kleur zwart oplevert, en FF0000 resulteert in puur rood.
Welke kleuren kunnen met een Engelse kleurennaam worden aangeduid?
Er worden slechts 16 Engelse kleurennamen ondersteund door het standaard HTML 4.01 protocol (dit is nog steeds een veelgebruikte en gangbare HTML-taal die gebruikt wordt voor het maken van websites). Dit zijn achtereenvolgens, inclusief hexadecimale kleurcode:
Engelse kleurennaam | Nederlandse naam | Hexadecimale kleurcode |
black | zwart | 000000 |
red | rood | FF0000 |
lime | limoen | 00FF00 |
blue | blauw | 0000FF |
uchsia | magenta | FF00FF |
yellow | geel | FFFF00 |
aqua | cyaan | 00FFFF |
white | wit | FFFFFF |
silver | zilver | C0C0C0 |
maroon | kastanjebruin | 800000 |
green | groen | 008000 |
navy | marine | 000080 |
purple | paars | 800080 |
olive | olijfgroen | 808000 |
teal | groenblauw | 008080 |
gray | grijs | 808080 |
Hoe worden deze kleuren in HTML-taal gebruikt?
In de volgende HTML-code is te zien dat de achtergrondkleur (bgColor) van het document zwart is, dat de tekst wit wordt en dat links (link) naar bijvoorbeeld een website of e-mailadres oranje zijn, en dat reeds bezochte links (vLink) groen zijn. Daarnaast worden actieve links (aLink) rood weergegeven. In plaats van de Engelse kleurennaam text=white kan ook de hexadecimale kleurcode worden gebruikt, text=#000000. Hexadecimale codes moeten wel voorafgegaan worden door een hekje #.
<BODY aLink=#cc0000 link=#ff6600 bgColor=black text=white vLink=#00cc00>
De volledige lijst met Engelse kleurennamen
Het HTML 4.01-protocol kan dus maar 16 kleuren met een Engelse kleurennaam lezen en laten zien, maar als kleuren met een hexadecimale code worden aangeduid dan kunnen alle 16 miljoen kleuren worden gelezen en getoond. Overigens kunnen moderne internetbrowsers, buiten het HTML 4.01-protocol om, veel meer Engelse kleurennamen lezen en tonen, te denken valt aan orangered, gold, lightblue, coral, yellowgreen, blueviolet, sandybrown, ivory of dimgray. Totaal ziet deze lange lijst met ongeveer 150 kleurennamen, inclusief de bijbehorende hexadecimale codes er als volgt uit:
Rode kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
indianred | indisch rood | CD5C5C |
lightcoral | lichtkoraal | F08080 |
salmon | zalm | FA8072 |
darksalmon | donkerzalm | E9967A |
orangered | oranjerood | FF4500 |
red | rood | FF0000 |
crimson | vermiljoen | DC143C |
firebrick | vuurvaste baksteen | B22222 |
darkred | donkerrood | 8B0000 |
Oranje kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
lightsalmon | lichtzalm | FFA07A |
orange | oranje | FFA500 |
darkorange | donkeroranje | FF8C00 |
coral | koraal | FF7F50 |
tomato | tomaat | FF6347 |
orangered | oranjerood | FF4500 |
Gele kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
lightyellow | lichtgeel | FFFFE0 |
lemonchiffon | | FFFACD |
lightgoldenrodyellow | | FAFAD2 |
papayawhip | | FFEFD5 |
moccasin | | FFE4B5 |
peachpuff | | FFDAB9 |
palegoldenrod | | EEE8AA |
khaki | kaki | F0E68C |
yellow | geel | FFFF00 |
gold | goud | FFD700 |
darkkhaki | donkerkaki | BDB76B |
Groene kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
greenyellow | groengeel | ADFF2F |
chartreuse | groen | 7FFF00 |
lawngreen | grasgroen | 7CFC00 |
lime | limoen | 00FF00 |
palegreen | bleekgroen | 98FB98 |
lightgreen | lichtgroen | 90EE90 |
mediumspringgreen | midlentegroen | 00FA9A |
springgreen | lentegroen | 00FF7F |
yellowgreen | groengeel | 9ACD32 |
limegreen | limoengroen | 32CD32 |
mediumseagreen | | 3CB371 |
seagreen | zeegroen | 2E8B57 |
forestgreen | bosgroen | 228B22 |
green | donkergroen | 008000 |
olivedrab | | 6B8E23 |
olive | olijfgroen | 808000 |
darkolivegreen | donkerolijfgroen | 556B2F |
darkgreen | donkergroen | 006400 |
aquamarine | aquamarijn | 7FFFD4 |
mediumaquamarine | | 66CDAA |
darkseagreen | donkerzeegroen | 8FBC8F |
lightseagreen | lichtzeegroen | 20B2AA |
darkcyan | donkercyaan | 008B8B |
teal | groenblauw | 008080 |
Blauwe kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
lightcyan | lichtcyaan | E0FFFF |
paleturquoise | lichtturkoois | AFEEEE |
aqua | cyaan | 00FFFF |
cyan | cyaan | 00FFFF |
aquamarine | aquamarijn | 7FFFD4 |
turquoise | turkoois | 40E0D0 |
mediumturquoise | | 48D1CC |
darkturquoise | donkerturkoois | 00CED1 |
powderblue | | B0E0E6 |
lightsteelblue | staalblauw | B0C4DE |
lightblue | lichtblauw | ADD8E6 |
skyblue | hemelsblauw | 87CEEB |
lightskyblue | lichthemelsblauw | 87CEFA |
deepskyblue | diep hemelsblauw | 00BFFF |
cornflowerblue | korenbloemblauw | 6495ED |
steelblue | donkerstaalblauw | 4682B4 |
cadetblue | | 5F9EA0 |
mediumslateblue | | 7B68EE |
dodgerblue | | 1E90FF |
royalblue | koningsblauw | 4169E1 |
blue | blauw | 0000FF |
mediumblue | middenblauw | 0000CD |
darkblue | donkerblauw | 00008B |
navy | marine | 000080 |
midnightblue | midnachtsblauw | 191970 |
Paarse kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
lavender | lavendel | E6E6FA |
thistle | distel | D8BFD8 |
plum | pruim | DDA0DD |
violet | violet | EE82EE |
fuchsia | fuchsia (magenta) | FF00FF |
magenta | magenta (fuchsia) | FF00FF |
orchid | orchidee | DA70D6 |
mediumorchid | | BA55D3 |
mediumpurple | | 9370DB |
slateblue | | 6A5ACD |
blueviolet | blauwviolet | 8A2BE2 |
darkviolet | donkerviolet | 9400D3 |
darkorchid | | 9932CC |
rebeccapurple | | 663399 |
darkmagenta | donkermagenta | 8B008B |
purple | purper | 800080 |
darkslateblue | | 483D8B |
indigo | indigo | 4B0082 |
pink | roze | FFC0CB |
lightpink | lichtroze | FFB6C1 |
palevioletred | | DB7093 |
hotpink | acaciaroze | FF69B4 |
deeppink | dieproze | FF1493 |
mediumvioletred | middenvioletrood | C71585 |
Bruine kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
cornsilk | | FFF8DC |
blanchedalmond | | FFEBCD |
bisque | | FFE4C4 |
navajowhite | | FFDEAD |
wheat | | F5DEB3 |
burlywood | | DEB887 |
tan | | D2B48C |
rosybrown | | BC8F8F |
sandybrown | zandbruin | F4A460 |
goldenrod | | DAA520 |
darkgoldenrod | | B8860B |
peru | | CD853F |
chocolate | chocoladebruin | D2691E |
saddlebrown | | 8B4513 |
sienna | sienna | A0522D |
brown | bruin | A52A2A |
maroon | kastanjebruin | 800000 |
Witte kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
white | wit | FFFFFF |
snow | sneeuwwit | FFFAFA |
honeydew | | F0FFF0 |
mintcream | mint | F5FFFA |
azure | ultramarijn | F0FFFF |
aliceblue | | F0F8FF |
ghostwhite | | F8F8FF |
whitesmoke | rookwit | F5F5F5 |
seashell | schelp | FFF5EE |
beige | beige | F5F5DC |
oldlace | kant | FDF5E6 |
floralwhite | fluweelwit | FFFAF0 |
ivory | ivoor | FFFFF0 |
antiquewhite | | FAEBD7 |
linen | linnen | FAF0E6 |
lavenderblush | | FFF0F5 |
mistyrose | | FFE4E1 |
Grijze kleuren
Engelse kleurennaam | Nederlandse naam, indien bekend | Hexadecimale kleurcode |
gainsboro | | DCDCDC |
lightgray | lichtgrijs | D3D3D3 |
lightgrey | lichtgrijs | D3D3D3 |
silver | zilver | C0C0C0 |
darkgray | donkergrijs | A9A9A9 |
darkgrey | donkergrijs | A9A9A9 |
gray | grijs | 808080 |
grey | grijs | 808080 |
dimgray | | 696969 |
dimgrey | | 696969 |
lightslategray | lichtleigrijs | 778899 |
lightslategrey | lichtleigrijs | 778899 |
slategray | leigrijs | 708090 |
slategrey | leigrijs | 708090 |
darkslategray | donkerleigrijs | 2F4F4F |
darkslategrey | donkerleigrijs | 2F4F4F |
black | zwart | 000000 |
Zelf eigen kleuren kiezen
Zes hexadecimale getallen maken in totaal 16x16x16x16x16x16 = 16.777.216 combinaties mogelijk, dus even zoveel kleuren. Er is geen enkel computerprogramma of naslagwerk die deze kleuren even snel in een overzicht laat zien. Bij het kiezen van de kleuren die je zelf het mooist vindt kun je natuurlijk zelf gaan proberen door met de getallen te gaan variëren. Is #FFFFFF te wit, probeer dan #EEEEEE eens uit. Een hele mooie achtergrondkleur is #F3F3F3, dit levert een subtiel lichtgrijze kleur op die een website net wat minder flets kan maken.