banner

4.1: Kleurnamen

Wanneer je een bepaalde kleur wilt opnemen in je pagina, dan heb je drie mogelijkheden.
  1. Je gebruikt vaststaande kleurnamen
  2. Je gebruikt RGB( , , ) kleurcodes
  3. Je gebruikt hexadecimale (16-tallige) kleurcodes

In deze paragraaf bespreken we de vaste kleurnamen

Kleurnamen

Als je een kleur van een element wilt wijzigen dan kun je er style="color: kleurnaam;" aan toevoegen.
Als kleurnaam kun je gebruikmaken van o.a. de volgende 16 zogenaamde websafe kleuren:

blacksilvergraywhitemaroonredpurplefuchsiagreenlimeoliveyellownavybluetealaqua

Ondertussen zijn er 140 ondersteunde kleurnamen. Je vindt ze hier.

Om een tekst van een bepaalde paragraaf van kleur te veranderen, kun je bijvoorbeeld het volgende opnemen:
<p style="color: red;">Tekst in de kleur: red</p>
Dat levert onderstaand resultaat op:

Tekst in de kleur: red

Deze kleurnamen mag je natuurlijk ook gebruiken als achtergrondkleur. Voorgaande paragraaf met rode letters zouden we uit kunnen breiden met het attribuut background-color. Als we deze de waarde gray geven dan krijgt de paragraaf een grijze achtergrond met rode letters. Zie hieronder:

Tekst in de kleur rood op een grijze achtergrond.

Alhoewel 256 kleuren al heel wat lijkt, blijkt het toch vaak onvoldoende om de juiste kleur te treffen. Stel je maakt een website voor een vereniging of bedrijf dat beschikt over een bepaald logo met een bepaalde kleurstelling. Het is dan de eis dat kleuren van de website exact overeenkomen met de kleuren van logo.

Je kunt je voorstellen dat PSV niet blij wordt van onderstaand resultaat:

foute kleuren voor PSV-logo

Terwijl het logo er als volgt uit had moeten zien:

juiste kleuren voor PSV-logo

Hééééél veel meer kleurmogelijkheden vind je in de volgende paragraaf