Orange farve html. HTML tutorial
Vlad Merzhevich
I HTML indstilles farve på en af to måder: ved at bruge hexadecimal kode og ved navn af nogle blomster. Metoden baseret på det hexadecimale talsystem er overvejende brugt, da den er den mest universelle.
Hexadecimale farver
HTML bruger hexadecimale tal til at angive farver. Det hexadecimale system, i modsætning til decimalsystemet, er, som navnet antyder, baseret på tallet 16. Tallene vil være som følger: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Nummer 10 til 15 erstattes med latinske bogstaver. I tabel 6.1 viser overensstemmelsen mellem decimale og hexadecimale tal.
Tal større end 15 i det hexadecimale system dannes ved at kombinere to tal til ét (tabel 6.2). For eksempel tallet 255 tommer decimalsystem svarer til tallet FF i hexadecimal.
For at undgå forvirring ved definitionen af talsystemet, er et hexadecimalt tal foran et hash-symbol #, for eksempel #aa69cc. I dette tilfælde er sagen ligegyldig, så det er tilladt at skrive #F0F0F0 eller #f0f0f0.
En typisk farve brugt i HTML ser sådan ud.
Her er websidens baggrundsfarve sat til #FA8E47. Hash-symbolet # foran et tal betyder, at det er hexadecimalt. De første to cifre (FA) definerer den røde komponent i farven, det tredje til og med fjerde ciffer (8E) definerer den grønne komponent, og de sidste to cifre (47) definerer den blå komponent. Slutresultatet bliver denne farve.
F.A. | + | 8E | + | 47 | = | FA8E47 |
Hver af de tre farver - rød, grøn og blå - kan have værdier fra 00 til FF, hvilket resulterer i i alt 256 nuancer. Det samlede antal farver kan således være 256x256x256 = 16.777.216 kombinationer. En farvemodel baseret på røde, grønne og blå komponenter kaldes RGB (rød, grøn, blå; rød, grøn, blå). Denne model er additiv (fra add - add), hvor tilføjelsen af alle tre komponenter dannes hvid farve.
For at gøre det nemmere at navigere i hexadecimale farver, skal du tage højde for nogle regler.
- Hvis værdierne for farvekomponenterne er de samme (for eksempel: #D6D6D6), vil resultatet være grå nuance. Hvordan større antal, jo lysere farven er med værdier fra #000000 (sort) til #FFFFFF (hvid).
- En klar rød farve dannes, hvis den røde komponent gøres maksimal (FF), og de resterende komponenter sættes til nul. En farve med en værdi på #FF0000 er den rødest mulige røde nuance. Situationen er den samme med grøn(#00FF00) og blå (#0000FF).
- Gul (#FFFF00) laves ved at blande rød og grøn. Dette ses tydeligt på farvehjul(Fig. 6.1), som præsenterer primærfarverne (rød, grøn, blå) og komplementære eller yderligere. Disse omfatter gul, cyan og violet (også kaldet magenta). Generelt kan enhver farve opnås ved at blande farver tæt på den. Således opnås cyan (#00FFFF) ved at kombinere blå og grøn.
Ris. 6.1. Farve cirkel
Farver baseret på hexadecimale værdier skal ikke vælges empirisk. Velegnet til dette formål grafik editor kan arbejde med forskellige farvemodeller, f.eks. Adobe Photoshop. I fig. Figur 6.2 viser vinduet til at vælge en farve i dette program; den resulterende hexadecimale værdi af den aktuelle farve er skitseret med en linje. Du kan kopiere og indsætte det i din kode.
Ris. 6.2. Vindue til valg af farve i Photoshop program
Web farver
Hvis du indstiller skærmens farvegengivelseskvalitet til 8 bit (256 farver), kan den samme farve vises i forskellige browsere på min egen måde. Dette skyldes den måde, grafikken vises på, når browseren arbejder med sin egen palet og ikke kan vise en farve, der ikke er i paletten. I dette tilfælde erstattes farven af en kombination af pixels af andre, tæt på den, farver, der efterligner den givne. For at sikre, at farven forbliver den samme på tværs af forskellige browsere, blev en palet af såkaldte webfarver introduceret. Webfarver er de farver, for hvilke hver komponent - rød, grøn og blå - er indstillet til en af seks værdier - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC) 255 (FF). Den hexadecimale værdi af denne komponent er angivet i parentes. Det samlede antal farver fra alle mulige kombinationer giver 6x6x6 - 216 farver. Et eksempel på webfarve er #33FF66.
Hovedegenskaben ved webfarve er, at den ser ens ud i alle browsere. I dette øjeblik Relevansen af webfarver er meget lille på grund af forbedringen i kvaliteten af skærme og udvidelsen af deres muligheder.
Farver efter navn
For at undgå at skulle huske et sæt tal, kan du i stedet bruge navnene på almindeligt anvendte farver. I tabel 6.3 viser navnene på populære farvenavne.
Farvenavn | Farve | Beskrivelse | Hexadecimal værdi |
---|---|---|---|
sort | Sort | #000000 | |
blå | Blå | #0000FF | |
fuchsia | Lys lilla | #FF00FF | |
grå | Mørkegrå | #808080 | |
grøn | Grøn | #008000 | |
Citron | Lysegrøn | #00FF00 | |
rødbrun | Mørkerød | #800000 | |
flåde | Mørkeblå | #000080 | |
oliven | Oliven | #808000 | |
lilla | Mørke lilla | #800080 | |
rød | Rød | #FF0000 | |
sølv | Lysegrå | #C0C0C0 | |
krikand | Blågrøn | #008080 | |
hvid | hvid | #FFFFFF | |
gul | Gul | #FFFF00 |
Det er ligegyldigt, om du angiver en farve ved dens navn eller ved at bruge hexadecimale tal. Disse metoder er lige i deres virkning. Eksempel 6.1 viser, hvordan man indstiller baggrunds- og tekstfarver på en webside.
Eksempel 6.1. Baggrund og tekstfarve
Eksempel tekst
I i dette eksempel Baggrundsfarven indstilles ved hjælp af taggets bgcolor-attribut
, og tekstfarven gennem tekstattributten. For variation er værdien af tekstattributten sat til et hexadecimalt tal, og bgcolor-attributten indstilles til en reserveret en søgeord krikand.Farvekoder i CSS bruges til at angive farver. Typisk bruges farvekoder eller farveværdier til at indstille farven for enten forgrundsfarven på et element (f.eks. tekstfarve, linkfarve) eller baggrundsfarven for et element (baggrundsfarve, blokfarve). De kan også bruges til at ændre farven på en knap, kant, markør, svævemarkering og andre dekorative effekter.
Du kan indstille dine farveværdier forskellige formater. Følgende tabel viser alle mulige formater:
De anførte formater er beskrevet mere detaljeret nedenfor.
CSS-farver - Hex-koder
Hexadecimal farvekode er en sekscifret gengivelse af farve. De første to cifre (RR) repræsenterer den røde værdi, de næste to repræsenterer den grønne værdi (GG), og de sidste to repræsenterer den blå værdi (BB).
CSS-farver - korte hex-koder
Kort hex farvekode er en kortere form for seks-tegns notation. I dette format gentages hvert ciffer for at producere en tilsvarende sekscifret farveværdi. For eksempel: #0F0 bliver #00FF00.
Hexadecimal værdi kan tages fra enhver grafik software, såsom Adobe Photoshop, Core Draw osv.
Hver hexadecimal farvekode i CSS vil blive indledt af et hash-tegn "#". Nedenfor er eksempler på brug af hexadecimale notationer.
CSS-farver - RGB-værdier
RGB værdi er en farvekode, der indstilles ved hjælp af egenskaben rgb(). Denne egenskab har tre værdier: en hver for rød, grøn og blå. Værdien kan være et heltal, fra 0 til 255, eller en procentdel.
Bemærk: Ikke alle browsere understøtter egenskaben rgb() color, så det anbefales ikke at bruge den.
Nedenfor er et eksempel, der viser flere farver ved hjælp af RGB-værdier.
Farvekode generator
Du kan oprette millioner af farvekoder ved hjælp af vores service.
Browsersikre farver
Nedenfor er en tabel med 216 farver, der er de sikreste og mest computer-uafhængige. Disse farver i CSS spænder fra 000000 til FFFFFF hexadecimal kode. De er sikre at bruge, fordi de sikrer, at alle computere viser farver korrekt, når de arbejder med 256-farvepaletten.
Tabel over "sikre" farver i CSS | |||||
#000000 | #000033 | #000066 | #000099 | #0000CC | #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 | #3300CC | #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 | #9900CC | #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 |
HEX/HTML
HEX-farve er intet andet end en hexadecimal repræsentation af RGB.
Farver er repræsenteret som tre grupper hexadecimale cifre, hvor hver gruppe er ansvarlig for sin egen farve: #112233, hvor 11 er rød, 22 er grøn, 33 er blå. Alle værdier skal være mellem 00 og FF.
Mange applikationer tillader en forkortet form for hexadecimal farvenotation. Hvis hver af de tre grupper indeholder de samme tegn, for eksempel #112233, kan de skrives som #123.
- h1 ( farve: #ff0000; ) /* rød */
- h2 ( farve: #00ff00; ) /* grøn */
- h3 ( farve: #0000ff; ) /* blå */
- h4 ( farve: #00f; ) /* samme blå, stenografi */
RGB
RGB-farverummet (rød, grøn, blå) består af alle mulige farver, der kan skabes ved at blande rød, grøn og blå. Denne model er populær inden for fotografering, tv og computergrafik.
RGB-værdier er angivet som et heltal fra 0 til 255. For eksempel vises rgb(0,0,255) som blåt, fordi den blå parameter er sat til sin højeste værdi (255), og de andre er sat til 0.
Nogle applikationer (især webbrowsere) understøtter procentvis registrering af RGB-værdier (fra 0% til 100%).
- h1 ( farve: rgb(255, 0, 0); ) /* rød */
- h2 ( farve: rgb(0, 255, 0); ) /* grøn */
- h3 ( farve: rgb(0, 0, 255); ) /* blå */
- h4 ( farve: rgb(0%, 0%, 100%); ) /* samme blå, procentindtastning */
RGB-farveværdier understøttes i alle større browsere.
RGBA
For nylig har moderne browsere lært at arbejde med RGBA-farvemodellen – en udvidelse af RGB med understøttelse af en alfakanal, som bestemmer et objekts opacitet.
Betyder RGBA farver er angivet i formen: rgba(rød, grøn, blå, alfa). Alfa-parameteren er et tal fra 0,0 (fuldt gennemsigtig) til 1,0 (fuldstændig uigennemsigtig).
- h1 (farve: rgb(0, 0, 255); ) /* blå i almindelig RGB */
- h2 ( farve: rgba(0, 0, 255, 1); ) /* den samme blå i RGBA, fordi opacitet: 100% */
- h3 ( farve: rgba(0, 0, 255, 0,5); ) /* opacitet: 50% */
- h4 ( farve: rgba(0, 0, 255, .155); ) /* opacitet: 15,5% */
- h5 ( farve: rgba(0, 0, 255, 0); ) /* helt gennemsigtig */
RGBA understøttes i IE9+, Firefox 3+, Chrome, Safari og Opera 10+.
HSL
HSL-farvemodellen er en repræsentation af RGB-modellen i et cylindrisk koordinatsystem. HSL repræsenterer farver på en mere intuitiv og menneskelig læsbar måde end typisk RGB. Modellen bruges ofte i grafiske applikationer, i farvepaletter og til billedanalyse.
HSL står for Hue (farve/nuance), Saturation (saturation), Lightness/Luminans (lightness/lightness/luminosity, ikke at forveksle med lysstyrke).
Hue angiver farvens position på farvehjulet (fra 0 til 360). Mætning er den procentvise værdi af mætningen (fra 0 % til 100 %). Lethed er en procentdel af lethed (fra 0% til 100%).
- h1 ( farve: hsl(120, 100%, 50%); ) /* grøn */
- h2 ( farve: hsl(120, 100%, 75%); ) /* lysegrøn */
- h3 ( farve: hsl(120, 100%, 25%); ) /* mørkegrøn */
- h4 ( farve: hsl(120, 60%, 70%); ) /* pastelgrøn */
HSL understøttes i IE9+, Firefox, Chrome, Safari og Opera 10+.
HSLA
I lighed med RGB/RGBA har HSL en HSLA-tilstand, der understøtter en alfakanal til at angive opaciteten af et objekt.
Betyder HSLA farver er givet i formen: hsla(nuance, saturation, lightness, alpha). Alfa-parameteren er et tal fra 0,0 (fuldt gennemsigtig) til 1,0 (fuldstændig uigennemsigtig).
- h1 ( farve: hsl(120, 100%, 50%); ) /* grøn i normal HSL */
- h2 ( farve: hsla(120, 100%, 50%, 1); ) /* den samme grønne i HSLA, fordi opacitet: 100% */
- h3 (farve: hsla(120, 100%, 50%, 0,5); ) /* opacitet: 50% */
- h4 (farve: hsla(120, 100%, 50%, .155); ) /* opacitet: 15,5% */
- h5 ( farve: hsla(120, 100%, 50%, 0); ) /* helt gennemsigtig */
CMYK
CMYK-farvemodellen forbindes ofte med farvetryk og tryk. CMYK (i modsætning til RGB) er en subtraktiv model, hvilket betyder, at højere værdier er forbundet med mørkere farver.
Farver bestemmes af forholdet mellem cyan (Cyan), magenta (Magenta), gul (Gul), med tilføjelse af sort (Nøgle/sort).
Hvert af tallene, der definerer en farve i CMYK, repræsenterer procentdelen af blæk af en given farve, der udgør farvekombinationen, eller mere præcist størrelsen af skærmprikken, der vises på en fotosætmaskine på film af en given farve (eller direkte på trykt form i tilfælde af CTP).
For at opnå PANTONE 7526-farven skal du f.eks. blande 9 dele cyan, 83 dele magenta, 100 dele gul og 46 dele sort. Dette kan betegnes som følger: (9,83,100,46). Nogle gange bruges følgende betegnelser: C9M83Y100K46, eller (9%, 83%, 100%, 46%) eller (0,09/0,83/1,0/0,46).
HSB/HSV
HSB (også kendt som HSV) ligner HSL, men de er to forskellige farvemodeller. De er begge baseret på cylindrisk geometri, men HSB/HSV er baseret på "hexcone" modellen, mens HSL er baseret på "bi-hexcone" modellen. Kunstnere foretrækker ofte at bruge denne model, det er generelt accepteret, at HSB/HSV-enheden er tættere på den naturlige opfattelse af farver. Især HSB-farvemodellen bruges i Adobe Photoshop.
HSB/HSV står for Hue (farve/nuance), Saturation (saturation), Brightness/Value (lysstyrke/værdi).
Hue angiver farvens position på farvehjulet (fra 0 til 360). Mætning er den procentvise værdi af mætningen (fra 0 % til 100 %). Lysstyrke er en procentdel af lysstyrken (fra 0 % til 100 %).
XYZ
XYZ-farvemodellen (CIE 1931 XYZ) er et rent matematisk rum. I modsætning til RGB, CMYK og andre modeller er de vigtigste komponenter i XYZ "imaginære", hvilket betyder, at du ikke kan forbinde X, Y og Z med et sæt farver, der skal blandes. XYZ er mestermodellen for næsten alle andre farve modeller, brugt i tekniske områder.
LAB
Farve LAB model(CIELAB, "CIE 1976 L*a*b*") beregnes ud fra CIE XYZ-rummet. Labs designmål var at skabe et farverum, hvor farveændringer ville være mere lineære med hensyn til menneskelig perception (sammenlignet med XYZ), det vil sige, så den samme ændring i farvekoordinatværdier i forskellige områder af farverummet ville producere den samme fornemmelse af farveændring.
Se nøje på tegningen. Baggrunden for rullemenuen er gjort gennemskinnelig. Dette er en ret almindelig designteknik. Lad os tænke over, hvordan dette kan implementeres.
Opgave
Gør farven på tværs af browser gennemskinnelig.
Løsning
Den første tanke i denne situation er at bruge et png24-billede med en forudindstillet gennemskinnelighed for baggrunden. Men dette billede er fuldstændig unødvendigt. Du kan fint klare dig uden (og derfor uden en ekstra anmodning til serveren). Lad os stadig prøve at finde den optimale løsning.
Den anden tanke er at bruge . Men i I dette tilfælde dette er ikke særlig bekvemt. Når alt kommer til alt, så bliver ikke kun baggrunden, men også inskriptionerne gennemskinnelige. Ja, faktisk hele vinduet på én gang.
Selvfølgelig kan du prøve at tilføje en ekstra beholder og kun anvende opacitet på den, men dette HTML-element er kun beregnet til dekoration og vil naturligvis være overflødigt. Er det muligt at undvære det?
Selvfølgelig kan du! Hvis du bruger RGBA.
RGBA farvebeskrivelsesformat
CSS3 giver dig mulighed for at angive farve ved hjælp af RGB- og RGBA-funktioner. I dette tilfælde skal vi angive andelen af hver farvekomponent, som en byte er allokeret til (fra 0 til 255, hvis nogen ikke ved det).
Syntaksen for denne sag er meget enkel:
Baggrund: rgb(0, 255, 0); /* ren grøn */
For RGBA tilføjes en fjerde parameter - alfa-gennemsigtighed (fra 0 til 1).
Baggrund: rgba(255, 0, 0, 0,5); /* ren rød med 50 % gennemsigtighed */
Her er den løsningen på vores problem. Indstil blot baggrundsfarven ved hjælp af rgba, og alt vil se ud, som vi ønsker. Uden ekstra billeder og elementer!
Hvor kan jeg få disse tal?
Du kan se på farvekomponenterne ved hjælp af Photoshops pipetteværktøj.
Om kompatibilitet på tværs af browsere
Da RGB-funktionen er meget ældre end RGBA og har været til stede siden CSS2-standardens dage, for at beskytte mod de ældste browsere, kan du bruge følgende duplikatkonstruktion:
SomeBlock (baggrund: rgb(255, 0, 0); baggrund: rgba(255, 0, 0, 0.5); )
Med denne tilgang, oldefædre moderne browsere der vil ikke være nogen gennemskinnelighed, men selve farven forbliver korrekt.
Du bliver nødt til at tage dig af IE separat. Æsler forstår ikke RGBA helt op til version 8 inklusive.
Som altid: jord til bønderne, fabrikker til arbejderne og æsler en krykke! Som .
Under kampforhold sætter vi naturligvis denne regel i en separat CSS, som vi forbinder.
SomeBlock (baggrund:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#80ff0000,endColorstr=#80ff0000); zoom: 1; )
Tricket er at angive start- og slutfarver som de samme (ff0000 - rød) og udnytte det faktum, at du kan indstille alfakanalen for gradienten i dette filter (i eksemplet er værdien 80).
Til reference: filteret bruger hexadecimalt system og en fuldstændig uigennemsigtig farve svarer til koden FF (i decimal er dette 255). Følgelig er hexadecimal 80 decimal 128, dvs. 50 % gennemsigtighed.
Testet i:
- IE 6-9
- Firefox 3+
- Opera 10+
- Safari 4
- Chrome
>>Farvestyring
Hexadecimale RGB-farveværdier
Metoder til at beskrive og behandle farve adskiller sig fra hinanden i, hvilken endelig repræsentation de er beregnet til. Lad os f.eks. sammenligne repræsentationen af farver til print og til computerskærme. I det første tilfælde tages grundlaget hvid farven på det papir, hvorpå tre primærfarver efterfølgende påføres: blå, lilla Og gul. Blanding med hinanden og med papirets hvide farve i forskellige proportioner giver disse tre primærfarver forskellige farvenuancer, bortset fra ren sort, eller i fuldstændig fravær af maling giver de hvidt papir. Hvis vi tilføjer sort farve til dem, får vi CMYK-en metode til at overføre farve, når den ønskede farve opnås ved at trække de manglende farver fra hvid.
I det andet tilfælde tages grundlaget sort farven på monitorskærmen, hvor hver celle lyser i en af tre farver: rød-rød, grøn-grøn og blå-blå. Så, i fuldstændig fravær af glød, får vi en ren sort skærmfarve, og enhver af de nødvendige farver er givet af forholdet mellem hver af de tre farver. I dette tilfælde får vi RGB-metode til farvetransmission. Primære farver kan variere fra 0
Før 255
, eller fra 0%
Før 100%
, eller kan repræsenteres som en hexadecimal værdi. I figuren nedenfor kan du se resultaterne af blanding af primærfarver.
Det hexadecimale talsystem har i modsætning til decimaltalsystemet ikke ti cifre, men seksten - deraf navnet. Følgelig kan der kun være ikke-gentagende varianter af kombinationer af to cifre - 256 , for at fortsætte rækken af tal efter 9 breve fra EN Før F derfor vil serien se sådan ud -
0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. |
I dette tilfælde er farven angivet med tre hexadecimale tal, som hver består af to cifre. Det første tal bestemmer intensiteten rød farver, mellem- grøn, sidste ting- blå farver. Alle tal kan have værdier i området fra 00 Før FF(fra 0 til 255). For eksempel: grøn farve er angivet som #00FF00, rødlignende #FF0000, blålignende #0000FF, hvidlignende #FFFFFF, fuldstændig fravær af farve eller sort er angivet som #000000 .
I formularen nedenfor kan du angive eventuelle hexadecimale værdier for hver af de tre farver og se resultatet af at blande dem ved at klikke i outputfeltet.
Eksempler på nogle hexadecimale RGB-farveværdier: gradueringer af rød, blå og grøn.
udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode |
#010000 | #800000 | #000100 | #008000 | #000001 | #000080 | ||||||
#100000 | #900000 | #001000 | #009000 | #000010 | #000090 | ||||||
#200000 | #A00000 | #002000 | #00A000 | #000020 | #0000A0 | ||||||
#300000 | #B00000 | #003000 | #00B000 | #000030 | #0000B0 | ||||||
#400000 | #C00000 | #004000 | #00C000 | #000040 | #0000C0 | ||||||
#500000 | #D00000 | #005000 | #00D000 | #000050 | #0000D0 | ||||||
#600000 | #E00000 | #006000 | #00E000 | #000060 | #0000E0 | ||||||
#700000 | #FF0000 | #007000 | #00FF00 | #000070 | #0000FF |
Angivelse af farve ved hjælp af strengbogstaver
For at lette brugen blev nogle farver og deres kombinationer tildelt navne, der genkendes af alle browsere, og det blev muligt at angive mange af dem ved navn. Tabellen nedenfor viser nogle af farvenavnene:
udsigt | Navn | udsigt | Navn | udsigt | Navn | udsigt | Navn |
hvid | Rød | orange | Gul | ||||
Grøn | Blå | Lilla | Sort | ||||
Aliceblue | Antik hvid | Aqua | Akvamarin | ||||
Azure | Beige | Bisque | Blanchedalmond | ||||
Blåviolet | Brun | Burlywood | Kadetblå | ||||
Chartreuse | Chokolade | Koral | Kornblomstblå | ||||
Majssilke | Crimson | Cyan | Mørkeblå | ||||
Mørkecyan | Mørkeguld | Mørkegrå | Mørkegrøn | ||||
Darkkhaki | Mørkmagenta | mørkeolivegrøn | Mørk orange | ||||
Darkorchid | Mørkerød | Mørk laks | Mørkegrøn | ||||
Mørke skiferblå | Mørkslagegray | Mørketurkis | Mørkeviolet | ||||
Deeppink | Dyb himmelblå | Dimgray | Dodgerblue | ||||
Ildsten | Blomsterhvid | Skovgrøn | Fuschia | ||||
Gainsboro | Ghostwhite | Guld | Guldris | ||||
Grå | Grøngul | Honningdug | Hot pink | ||||
Indianred | Indigo | elfenben | Kaki | ||||
Lavendel | Lavendelblush | Citronchiffon | Lyseblå | ||||
Lyskoral | Lyscyan | Lyskoldenrødgul | Lysegrøn | ||||
Lysegrå | Lyserød | Lyslaks | Lysegrøn | ||||
Lyseblå | Lysslagegray | Lysestålblå | Lysegul | ||||
Citron | Lime grøn | Linned | Magenta | ||||
Rødbrun | Medium akvamarin | Mellemblå | Mediumorchid | ||||
Mellemlilla | Mellemsøgrøn | Mellemskiferblå | Mellemspringgrøn | ||||
Mediumturkis | Mellemviolet | Midnatsblå | Myntecreme | ||||
Mistyrose | Navajowhite | Flåde | Oldlace | ||||
Oliven | Oliverab | Orangerød | Orkidé | ||||
Palegoldenrod | Lysegrøn | Paleturkis | Blegviolet | ||||
Papayapisk | Peachpuff | Peru | Lyserød | ||||
Blomme | Pulverblå | Rosenbrun | Kongeblå | ||||
Sadelbrun | Søgrøn | Muslingeskal | Sienna | ||||
Sølv | Himmelblå | Skiferblå | Slategray | ||||
Sne | Springgrøn | Stålblå | Tan | ||||
Blågrøn | Tidsel | Tomat | Turkis | ||||
Violet | Hvede | Hvid røg | Gul grøn |
Brug af en sikker farvepalet
Desværre på forskellige platforme Med forskellige systemindstillinger er korrekt farvegengivelse et problem. Sagen er, at browseren altid forsøger at justere farvepaletten i dokumentet, så den passer Systemindstillinger og monitorens muligheder ved selvstændigt at blande farver og erstatte dem. Som et resultat kan brugeren nogle gange ikke se præcis, hvad webmasteren ønskede at vise ham. En vej ud af denne situation blev fundet i brugen af en palette, hvis farve garanteres at blive gengivet ligeligt af alle browsere på forskellige platforme. Dette er den såkaldte garanteret palet, også kaldet sikker palet. Denne palet indeholder farver, hvis farvekomponenter har følgende værdier: 00 ,33 ,66 ,99 , CC,FF, på alle mulige måder 216 deres kombinationer.
udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode | udsigt | kode |
FFFFFF | CCCCCC | 999999 | 666666 | 333333 | 000000 | ||||||
CCCC66 | CCCC33 | 999966 | 999933 | 999900 | 666600 | ||||||
CCFF66 | CCFF00 | CCFF33 | CCCC99 | 666633 | 333300 | ||||||
99FF00 | 99FF33 | 99CC66 | 99CC00 | 99CC33 | 669900 | ||||||
CCFF99 | 99FF99 | 66CC00 | 66CC33 | 669933 | 336600 | ||||||
66FF00 | 66FF33 | 33FF00 | 33CC00 | 339900 | 009900 | ||||||
33FF33 | 00FF33 | 00FF00 | 00CC00 | 33CC33 | 00CC33 | ||||||
CCFFCC | 99CC99 | 66CC66 | 669966 | 336633 | 003300 | ||||||
99FF99 | 66FF66 | 33FF66 | 00FF66 | 339933 | 006600 | ||||||
66FF99 | 33FF99 | 00FF99 | 33CC66 | 00CC66 | 009933 | ||||||
66CC99 | 33CC99 | 00CC99 | 339966 | 009966 | 006633 | ||||||
99FFCC | 66FFCC | 33FFCC | 00FFCC | 33CCCC | 009999 | ||||||
CCFFFF | 99FFFF | 66FFFF | 33FFFF | 00FFFF | 00CCCC | ||||||
99CCCC | 66CCCC | 339999 | 669999 | 006666 | 336666 | ||||||
66CCFF | 33CCFF | 00CCFF | 3399CC | 0099CC | 003333 | ||||||
99CCFF | 3399FF | 0099FF | 6699CC | 336699 | 006699 | ||||||
0066FF | 3366CC | 0066CC | 0033FF | 003399 | 003366 | ||||||
6699FF | 3366FF | 0000 FF | 0000CC | 0033CC | 000033 | ||||||
3333FF | 3300 FF | 3300CC | 3333CC | 000099 | 000066 | ||||||
9999CC | 6666FF | 6666CC | 666699 | 333399 | 333366 | ||||||
CCCCFF | 9999FF | 6666FF | 6600FF | 330099 | 330066 | ||||||
9966CC | 9966FF | 6600CC | 6633CC | 663399 | 330033 | ||||||
CC99FF | CC66FF | 9933FF | 9900FF | 660099 | 663366 | ||||||
CC66FF | CC33FF | CC00FF | 9900CC | 996699 | 660066 | ||||||
CC99CC | CC66CC | CC33CC | CC00CC | 990099 | 993399 | ||||||
FFCCFF | FF99FF | FF66FF | FF33FF | FF00FF | CC3399 | ||||||
FF66CC | FF00CC | FF33CC | CC6699 | CC0099 | 990066 | ||||||
FF99CC | FF3399 | FF0099 | CC0066 | 993366 | 660033 | ||||||
FF6699 | FF3399 | FF0066 | CC3366 | 996666 | 663333 | ||||||
CC9999 | CC6666 | CC3333 | CC0000 | 990033 | 330000 | ||||||
FFCCCC | FF9999 | FF6666 | FF3333 | FF0000 | CC0033 | ||||||
FF6633 | CC3300 | FF3300 | FF0000 | CC0000 | 990000 | ||||||
FFCC99 | FFCC66 | FF6600 | CC6633 | 993300 | 660000 | ||||||
FF9900 | FF9933 | CC9966 | CC6600 | 996633 | 663300 | ||||||
FFCC66 | FFCC00 | FFCC33 | CC9900 | CC9933 | 996600 | ||||||
FFFFCC | FFFF99 | FFFF66 | FFFF33 | FFFF00 | CCCC00 |