|
Nätfärger Antecknat av Sture Åkerström 99 11 18 (#e9e8ca är färgen på denna rad) hemsidan |
||
| En färgkod i HTML-standarden
ser ut så här: color="#FFFFFF" Den består av sex hexadecimaler,
som motsvarar de tre färgerna rött (RR), grönt (GG) och
blått (BB). Man brukar tala om en färgs RGB-kod, d.v.s
dess Rött-Grönt-Blått-värde. RGB-värdet
anger vilka färger som används för att blanda till en viss
nyans: hur mycket rött, grönt och blått som ingår
i den. Andelen rött, grönt och blått anges alltså
med hexadecimaler, som ser ut så här: 0 1 2
3 4 5 6 7 8 9 A
B C D E F
Hur skall de kodas i ett HTML-dokument. Vad betyder färgkoderna? |
||
| Det är totalt 16
stycken, som du kan se. 0 betyder 'ingen färg' och F betyder 'full färg'.
Eftersom varje färkomponent har två hexadecimaler är ingen färg alls (00) eller full färg (FF). Vill man inte ha någon röd färg alls skriver man 00 och vill man ha knallrött skriver man FF i kolumnen för rött. Likadant för grönt och blått. #000000 ger svart och #FFFFFF ger vitt, #FF0000 är alltså rött. color="#F00" color="#100%,0%,0%" color="#255,0,0" (=decimalsystemet) color="red" Decimalsystemet används av många ritprogram.Man har valt att ge varje färg ett värde mellan 0 och 255, vilket betyder att varje färg i koden kan ha någon av 256 olika kulörer. |
||
| 0-255 i decimalvärdemotsvarar
00-FF i hexadecimalvärde, därför att det mellan 0 och
F finns 16 olika steg och 16x16 blir 256. Hexadecimalkoden brukar användas
för en palett med 256 olika färger.
Decimalkoden klarar av ända upp till 16,7 miljoner färger, för 256 x 256 x 256=16,777,216. |
||
| Några vanliga färger: samt gula och gråa nyanser som är ögonvänliga | ||
| #FF0000=rött | #00FF00=grönt | #0000FF=blått |
| #FFFF00=gult | #FFFFCC=ljusgult | #FFFFD8=ljusare gult |
| #00FFFF=turkos | #FF00FF=lila | #FFFFFF=vitt |
| #C0C0C0=silver | #CCCCCC=ljusgrå | #EEEEEE=ljusare grå |
| En del färger som
används på WWW är inte websäkra. Det beror
på att de inte ingår i just den
datorns färguppsättning och därför inte visas riktigt korrekt. Datorn (eller programmet) har till sitt förfogande en uppsättning färdigblandade färger. Men när den skall visa färger som inte ingår i denna standardpalett, måste den ta till ett knep, som kallas dithering. Den blandar då in pixlar från andra färger i en standardfärg. Därför pratar man ofta om att man skall använda någon av de 216 websäkra färgerna, de som är non-dithering. Det finns inga helt säkra färger och ingen palett som fungerar på alla plattformar. Däremot finns det en palett med 216 färger, som fungerar på de flesta skärmar. Problemet är att olika system och program använder olika färgpaletter. Windows 3.x, var anpassad till SVGA-grafiken, d.v.s till en 256-färgers palett. Men Windows använder själv 20 av dessa färger till själva systemet och dessutom ytterligare 13 till Windows-logon. Därför blir det bara 223 färger . Nu är ju 223 inget lätthanterligt tal, matematiskt sett, så man bestämde sig för att använda 216 färger: 6 röda, 6 gröna och 6 blå. Multiplicerar man 6 med sig själv 3 gånger (6x6x6) får man mycket riktigt 216. 'Non-dithering'-färgerna är i princip uppbyggda kring hexadecimalerna 00, 33, 66, 99, CC och FF. Genom att bara använda kombinationer av dessa kan man tillverka sådana färger. Men hur vet man då vilket hexadecimalt värde en färg med ett decimalt värde har? |
||
| Du har en färgs decimalvärde
och vill veta dess hexadecimalvärde. Du använder då bara
den miniräknare som finns som tilläggsprogram till datorn: skriv
in decimalvärdet och klicka på HEX, så får du hexadecimalkoden!
Du kan också göra det åt andra hållet och få
decimalvärde på ett hexadecimalt tal.
Här är en tabell med hexadecimalkod, decimalkod och procent: |
||
| Hexadecimal | 00 | 33 | 66 | 99 | CC | FF |
| Decimal | 00 | 51 | 102 | 153 | 204 | 255 |
| Procent | 00 | 20 | 40 | 60 | 80 | 100 |
|
'Säkra' färger |
||||||
| #000000 | #003300 | #006600 | #009900 | #00CC00 | #00FF00 | ||||||
| #000033 | #003333 | #006633 | #009933 | #00CC33 | #00FF33 | ||||||
| #000066 | #003366 | #006666 | #009966 | #00CC66 | #00FF66 | ||||||
| #000099 | #003399 | #006699 | #009999 | #00CC99 | #00FF99 | ||||||
| #0000CC | #0033CC | #0066CC | #0099CC | #00CCCC | #00FFCC | ||||||
| #0000FF | #0033FF | #0066FF | #0099FF | #00CCFF | #00FFFF | ||||||
| #330000 | #333300 | #336600 | #339900 | #33CC00 | #33FF00 | ||||||
| #330033 | #333333 | #336633 | #339933 | #33CC33 | #33FF33 | ||||||
| #330066 | #333366 | #336666 | #339966 | #33CC66 | #33FF66 | ||||||
| #330099 | #333399 | #336699 | #339999 | #33CC99 | #33FF99 | ||||||
| #3300CC | #3333CC | #3366CC | #3399CC | #33CCCC | #33FFCC | ||||||
| #3300FF | #3333FF | #3366FF | #3399FF | #33CCFF | #33FFFF | ||||||
| #660000 | #663300 | #666600 | #669900 | #66CC00 | #66FF00 | ||||||
| #660033 | #663333 | #666633 | #669933 | #66CC33 | #66FF33 | ||||||
| #660066 | #663366 | #666666 | #669966 | #66CC66 | #66FF66 | ||||||
| #660099 | #663399 | #666699 | #669999 | #66CC99 | #66FF99 | ||||||
| #6600CC | #6633CC | #6666CC | #6699CC | #66CCCC | #66FFCC | ||||||
| #6600FF | #6633FF | #6666FF | #6699FF | #66CCFF | #66FFFF | ||||||
| #990000 | #993300 | #996600 | #999900 | #99CC00 | #99FF00 | ||||||
| #990033 | #993333 | #996633 | #999933 | #99CC33 | #99FF33 | ||||||
| #990066 | #993366 | #996666 | #999966 | #99CC66 | #99FF66 | ||||||
| #990099 | #993399 | #996699 | #999999 | #99CC99 | #99FF99 | ||||||
| #9900CC | #9933CC | #9966CC | #9999CC | #99CCCC | #99FFCC | ||||||
| #9900FF | #9933FF | #9966FF | #9999FF | #99CCFF | #99FFFF | ||||||
| #CC0000 | #CC3300 | #CC6600 | #CC9900 | #CCCC00 | #CCFF00 | ||||||
| #CC0033 | #CC3333 | #CC6633 | #CC9933 | #CCCC33 | #CCFF33 | ||||||
| #CC0066 | #CC3366 | #CC6666 | #CC9966 | #CCCC66 | #CCFF66 | ||||||
| #CC0099 | #CC3399 | #CC6699 | #CC9999 | #CCCC99 | #CCFF99 | ||||||
| #CC00CC | #CC33CC | #CC66CC | #CC99CC | #CCCCCC | #CCFFCC | ||||||
| #CC00FF | #CC33FF | #CC66FF | #CC99FF | #CCCCFF | #CCFFFF | ||||||
| #FF0000 | #FF3300 | #FF6600 | #FF9900 | #FFCC00 | #FFFF00 | ||||||
| #FF0033 | #FF3333 | #FF6633 | #FF9933 | #FFCC33 | #FFFF33 | ||||||
| #FF0066 | #FF3366 | #FF6666 | #FF9966 | #FFCC66 | #FFFF66 | ||||||
| #FF0099 | #FF3399 | #FF6699 | #FF9999 | #FFCC99 | #FFFF99 | ||||||
| #FF00CC | #FF33CC | #FF66CC | #FF99CC | #FFCCCC | #FFFFCC | ||||||
| #FF00FF | #FF33FF | #FF66FF | #FF99FF | #FFCCFF | #FFFFFF | ||||||
|
© Sture Åkerström,
05 05 07 E-post,
Tel 0924-203 10, |