Scalable Vector Graphics/Kleuren

Uit Wikibooks

SVG

Inleiding
  1. Elementen
  2. Attributen
  3. Kleuren
  4. Trefwoorden
  5. Links

De wijze waarop kleuren worden opgegeven komt overeen met de door het W3C vastgestelde standaarden voor CSS. Voor 140 basiskleuren zijn (Engelstalige) termen vastgelegd, d.m.v. drie andere technieken kunnen meer tinten worden geproduceerd.

Inhoud Voorbeeld (rood) Aantal mogelijke kleuren
basiskleuren kleurnaam red 140
HTML-code # en 6 hexadecimale tekens (0 t/m 9 en a t/m f) #ff0000 16.777.216
rgb-waarde rgb(rood, groen, blauw), decimaal, 0 t/m 255 rgb(255, 0, 0) 16.777.216
rgb-waarde rgb(rood, groen, blauw), in procenten rgb(100%, 0%, 0%) 1.030.301

Basiskleuren[bewerken]

De volgende 140 basiskleuren zijn gedefinieerd:

aliceblue, antiquewhite, aqua, aquamarine, azure, beige, bisque, black, blanchedalmond, blue, blueviolet, brown, burlywood, cadetblue, chartreuse, chocolate, coral, cornflowerblue, cornsilk, crimson, cyan, darkblue, darkcyan, darkgoldenrod, darkgray, darkgreen, darkgrey, darkkhaki, darkmagenta, darkolivegreen, darkorange, darkorchid, darkred, darksalmon, darkseagreen, darkslateblue, darkslategray, darkslategrey, darkturquoise, darkviolet, deeppink, deepskyblue, dimgray, dimgrey, dodgerblue, firebrick, floralwhite, forestgreen, fuchsia, gainsboro, ghostwhite, gold, goldenrod, gray, grey, green, greenyellow, honeydew, hotpink, indianred, indigo, ivory, khaki, lavender, lavenderblush, lawngreen, lemonchiffon, lightblue, lightcoral, lightcyan, lightgoldenrodyellow, lightgray, lightgreen, lightgrey, lightpink, lightsalmon, lightseagreen, lightskyblue, lightslategray, lightslategrey, lightsteelblue, lightyellow, lime, limegreen, linen, magenta, maroon, mediumaquamarine, mediumblue, mediumorchid, mediumpurple, mediumseagreen, mediumslateblue, mediumspringgreen, mediumturquoise, mediumvioletred, midnightblue, mintcream, mistyrose, moccasin, navajowhite, navy, oldlace, olive, olivedrab, orange, orangered, orchid, palegoldenrod, palegreen, paleturquoise, palevioletred, papayawhip, peachpuff, peru, pink, plum, powderblue, purple, red, rosybrown, royalblue, saddlebrown, salmon, sandybrown, seagreen, seashell, sienna, silver, skyblue, slateblue, slategray, slategrey, snow, springgreen, steelblue, tan, teal, thistle, tomato, turquoise, violet, wheat, white, whitesmoke, yellow, en yellowgreen.

  • N.B.: Merk op dat zowel "gray" als "grey" toegestaan zijn; hetzelfde geldt voor darkgray, darkslategray, dimgray, lightgray, lightslategray en slategray. Er bestaan dus 147 codes, waarmee in totaal 140 verschillende kleuren geprogrammeerd kunnen worden.

HTML-code[bewerken]

Een HTML-kleurcode bestaat uit een hekje ("#"), gevolgd door zes cijfers (0 t/m 9) of letters (a t/m f). De letters worden in dit (hexadecimale) systeem gebruikt om de getallen van 10 t/m 15 te noteren. Met deze tekens kunnen hexadecimale waarden van 0 t/m 255 worden samengesteld, door ze in drie groepen van twee te combineren. De eerste groep vertegenwoordigt de waarde voor rood, de tweede groep voor groen, de derde voor blauw.

fill="#7f7f7f"
  • N.B.: De complete reeks moet altijd uit zes tekens bestaan; b.v. de waarde nul voor een van de kleuren moet dus geschreven worden als 00.

RGB-waarde[bewerken]

Een kleur kan, net als in CSS, als RGB-waarde worden opgegeven, en wel op twee manieren: in beide gevallen wordt de functie rgb() aangeroepen met drie parameters (die tussen haakjes worden opgenomen), t.w. de waarden voor respectievelijk rood, groen en blauw.

  • De waarden voor rood, groen en blauw worden elk opgegeven als een getal dat 0 (nul) t/m 255 mag zijn, telkens gescheiden door een komma.
fill="rgb(127, 127, 127)"
  • De waarden voor rood, groen en blauw worden elk opgegeven als een percentage dat 0% t/m 100% mag zijn, telkens gescheiden door een komma.
fill="rgb(50%, 50%, 50%)"
Informatie afkomstig van https://nl.wikibooks.org Wikibooks NL.
Wikibooks NL is onderdeel van de wikimediafoundation.