Sellel lehel on tabel märksõnadega, mida saab kasutada värvide määramiseks sellistes veebiarenduskeeltes nagu: HTML, CSS, JavaScript, Flash jne.
Vanas WC3 spetsifikatsioonis kirjutati ainult 16 märksõna, millega HTML-is ja CSS-is värvid paika pandi. Hilisemates, kaasaegsemates spetsifikatsioonides lisati värvinimede tähistamiseks veel 130 märksõna. Järgmine tabel sisaldab värvinimesid, hex- ja RGB-koode, millele need vastavad.
CSS-i reeglite kohaselt ei ole värvinimed tõstutundlikud. Värvikirjed IndianRed ja indianred on samaväärsed.
Märkimist väärib ka see, et tabelis olevast 146 märksõnast on seal tegelikult vähem värve. Põhjus on selles, et mõned märksõnad viitavad samale värvile. Seega tähistavad nimed Grey ja Grey 50 protsenti halli koodiga #808080, samas kui sõna Magenta on fuksia värvi HTML-i sünonüüm, mis vastab kuueteistkümnendkoodile #FF00FF. Sõnad Aqua ja Cyan on samuti sünonüümid, need vastavad koodile #00FFFF .
|
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Värvide määramiseks kasutatakse kuueteistkümnendarvu. Kuueteistkümnendsüsteem, erinevalt kümnendsüsteemist, põhineb, nagu nimigi viitab, arvul 16. Arvud on järgmised: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Numbrid 10 kuni 15 asendatakse ladina tähtedega. Arvud, mis on suuremad kui 15 kuueteistkümnendsüsteemis, saadakse kahe arvu ühendamisel üheks. Näiteks kümnendsüsteemis olev arv 255 vastab kuueteistkümnendsüsteemis arvule FF. Et vältida segadust numbrisüsteemi definitsioonis, eelneb kuueteistkümnendsüsteemi arvule räsimärk #, näiteks #666999. Iga kolme värvi – punane, roheline ja sinine – väärtus võib olla vahemikus 00 kuni FF. Seega jaguneb värvi tähistus kolmeks komponendiks #rrggbb, kus esimesed kaks märki tähistavad värvi punast komponenti, kaks keskmist tähistavad rohelist ja kaks viimast tähistavad sinist. Lubatud on kasutada vormi #rgb lühendatud vormi, kus iga märk tuleb kahekordistada. Seega tuleks kirjet #fe0 käsitleda kui #ffee00.
nimepidi
| Internet Explorer | Chrome | Ooper | safari | Firefox | Android | iOS |
| 4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Brauserid toetavad mõnda värvi nime järgi. Tabelis. 1 näitab nimesid, kuueteistkümnendkoodi, väärtusi RGB-s, HSL-vormingus ja kirjeldust.
| Nimi | Värv | Kood | RGB | HSL | Kirjeldus |
|---|---|---|---|---|---|
| valge | #fffff või #ffff | rgb(255 255 255) | hsl (0,0%, 100%) | Valge | |
| hõbedane | #c0c0c0 | rgb(192 192 192) | hsl (0,0%, 75%) | Hall | |
| hall | #808080 | rgb(128 128 128) | hsl (0,0%, 50%) | Tumehall | |
| must | #000000 või #000 | rgb(0,0,0) | hsl(0,0%,0%) | Must | |
| kastanipunane | #800000 | rgb(128,0,0) | hsl(0,100%,25%) | Tumepunane | |
| punane | #ff0000 või #f00 | rgb(255,0,0) | hsl(0,100%,50%) | Punane | |
| oranž | #ffa500 | rgb(255 165, 0) | hsl (38,8 100%, 50%) | Oranž | |
| kollane | #ffff00 või #ff0 | rgb(255 255, 0) | hsl (60 100%, 50%) | Kollane | |
| oliiv | #808000 | rgb(128 128, 0) | hsl (60 100%, 25%) | Oliiv | |
| lubi | #00ff00 või #0f0 | rgb(0,255,0) | hsl (120 100%, 50%) | heleroheline | |
| roheline | #008000 | rgb(0,128,0) | hsl (120 100%, 25%) | Roheline | |
| aqua | #00ffff või #0ff | rgb(0 255 255) | hsl (180 100%, 50%) | Sinine | |
| sinine | #0000ff või #00f | rgb(0,0,255) | hsl (240 100%, 50%) | Sinine | |
| merevägi | #000080 | rgb(0,0,128) | hsl (240 100%, 25%) | mereväe sinine | |
| sinine | #008080 | rgb(0,128,128) | hsl (180 100%, 25%) | sinine Roheline | |
| fuksia | #ff00ff või #f0f | rgb(255;0,255) | hsl(300,100%,50%) | Roosa | |
| lilla | #800080 | rgb(128;0;128) | hsl (300 100%, 25%) | violetne |
RGB-ga
| Internet Explorer | Chrome | Ooper | safari | Firefox | Android | iOS |
| 5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
Värvi saab määrata punase, rohelise ja sinise kümnendkoha väärtuste abil. Iga kolme värvikomponendi väärtus on vahemikus 0 kuni 255. Samuti on lubatud määrata värvi protsendina, samas kui 100% vastab arvule 255. Esiteks määratakse rgb-märksõna ja seejärel määratakse värvikomponendid. määratud sulgudes, eraldatuna komadega, näiteks rgb(255 , 128, 128) või rgb(100%, 50%, 50%).
RGBA
| Internet Explorer | Chrome | Ooper | safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
RGBA-vorming on süntaksilt sarnane RGB-ga, kuid sisaldab alfakanalit, mis määrab elemendi läbipaistvuse. Väärtus 0 on täielikult läbipaistev, 1 on läbipaistmatu ja vahepealne väärtus, näiteks 0,5, on poolläbipaistev.
RGBA on lisatud CSS3-le, seega tuleks CSS-koodi valideerimine läbi viia vastavalt sellele versioonile. Tuleb märkida, et CSS3 standard on alles väljatöötamisel ja mõned funktsioonid võivad muutuda. Näiteks taustavärvi atribuudile lisatud RGB-värv läbib kontrolli, kuid tausta atribuudile lisatud värv mitte. Samal ajal saavad brauserid mõlema atribuudi värvist üsna õigesti aru.
HSL
| Internet Explorer | Chrome | Ooper | safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSL-vormingu nimi on moodustatud esimeste tähtede kombinatsioonist Hue (toon), Saturate (küllastus) ja Lightness (heledus). Toon on värviväärtus värvirattal (joonis 1) ja see on määratud kraadides. 0° on punane, 120° on roheline ja 240° on sinine. Tooni väärtus võib varieeruda vahemikus 0 kuni 359.
Riis. 1. Värviratas
Küllastus on värvi intensiivsus, mõõdetuna protsendina 0% kuni 100%. Väärtus 0% näitab värvi puudumist ja halli varjundit, 100% on maksimaalne küllastusväärtus.
Heledus määrab, kui hele on värv ja see määratakse protsendina vahemikus 0% kuni 100%. Väikesed väärtused muudavad värvi tumedamaks, suured väärtused heledamaks, äärmuslikud väärtused 0% ja 100% vastavad mustvalgele.
HSLA
| Internet Explorer | Chrome | Ooper | safari | Firefox | Android | iOS |
| 9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSLA-vorming on süntaksilt sarnane HSL-iga, kuid sisaldab alfakanalit, mis määrab elemendi läbipaistvuse. Väärtus 0 on täielikult läbipaistev, 1 on läbipaistmatu ja vahepealne väärtus, näiteks 0,5, on poolläbipaistev.
RGBA-, HSL- ja HSLA-vormingus värviväärtused lisatakse CSS3-le, nii et nende vormingute kasutamisel kontrollige koodi kehtivust versiooni suhtes.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
Hoiatus
Kõik saidil loetletud meetodid lõvi püüdmiseks on teoreetilised ja põhinevad arvutusmeetoditel. Autorid ei garanteeri teie ohutust nende kasutamisel ega võta vastutusest tulemuse eest. Pidage meeles, et lõvi on kiskja ja ohtlik loom!
Selle näite tulemus on näidatud joonisel fig. 2.
Riis. 2. Värvid veebilehel
CSS-i värvimoodul kirjeldab üksikasjalikult väärtusi, mis võimaldavad autoritel määrata html-elementide värve ja läbipaistmatust, samuti värviomaduse väärtusi.
värvi omadus
1. Prioriteetsed värvid: värviomadus
Atribuut määrab fondi värvi erinevate renderdussüsteemide abil. Atribuut kirjeldab elemendi teksti sisu värvi. Seda kasutatakse ka võimaliku kaudse väärtuse (currentColor) andmiseks mis tahes muudele värviväärtusi aktsepteerivatele omadustele.
Vara on päritud.
2. Värviväärtused
2.1. Peamised märksõnad
Peamiste märksõnade loend sisaldab järgmisi väärtusi:
| Nimi | HEX | RGB | Värv |
|---|---|---|---|
| must | #000000 | 0,0,0 | |
| hõbedane | #C0C0C0 | 192,192,192 | |
| hall | #808080 | 128,128,128 | |
| valge | #FFFFFF | 255,255,255 | |
| kastanipunane | #800000 | 128,0,0 | |
| punane | #FF0000 | 255,0,0 | |
| lilla | #800080 | 128,0,128 | |
| fuksia | #FF00FF | 255,0,255 | |
| roheline | #008000 | 0,128,0 | |
| lubi | #00FF00 | 0,255,0 | |
| oliiv | #808000 | 128,128,0 | |
| kollane | #FFFF00 | 255,255,0 | |
| merevägi | #000080 | 0,0,128 | |
| sinine | #0000FF | 0,0,255 | |
| sinine | #008080 | 0,128,128 | |
| aqua | #00FFFF | 0,255,255 |
Värvinimed ei ole tõstutundlikud.
Süntaks
Värv: sinine;
2.2. Numbrilised värviväärtused
2.2.1. RGB mudeli värvid
RGB-väärtuse vorming kuueteistkümnendsüsteemis on # märk, millele järgneb kohe kolm või kuus kuueteistkümnendmärki. Kolmekohaline RGB-tähis #rgb teisendatakse kuuekohaliseks vormiks #rrggbb numbrite kopeerimise, mitte nullide lisamise teel. Näiteks #fb0 laieneb #ffbb00-ks. See tagab, et valge #ffffff saab määrata #ffff stenogrammis, ja eemaldab kõik sõltuvused ekraani värvisügavusest.
RGB-väärtuse vorming funktsionaalses tähistuses on rgb (järgneb komadega eraldatud loend kolmest arvväärtusest (kas kolm täisarvu või kolm protsenti väärtust), millele järgneb märk). Täisarv 255 vastab 100% ja F või FF kuueteistkümnendsüsteemis:
rgb(255 255 255) = rgb (100%, 100%, 100%) = #FFF
Numbriväärtuste ümber on lubatud tühikud.
Veebikujunduses värvide esitamiseks on mitu võimalust.
HEX on kuueteistkümnendsüsteem värvide esitamiseks aluses 16. Selles süsteemis kasutatakse araabia kümnendnumbreid vahemikus 0 kuni 9 ja ladina tähti A kuni F, et täiendada digitaalset numbrit 16-ni. Veebikujunduse jaoks 16 põhivärvi (võtme) , nn kuueteistkümnendsüsteemi värvikood #RRGGBB, kus iga paar vastutab oma värviosa eest: RR - punane, GG - roheline ja BB - sinine. Iga värvifraktsioon on vahemikus 00 kuni FF.
Veel kaks veebidisaini värvide esitust on: RGB(*,*,*) kujul, kus iga värvi "*" osa on esindatud kümnendnumbritega 0 kuni 255 ja ingliskeelsete värvinimetustega.
Värvilise pildi loomisel on põhiprobleemiks värvide õige taasesitamine erinevat tüüpi arvutitel, monitoridel ja brauserites. Kui brauser ei suuda värvi õigesti renderdada, sobib see kokku või segab mitut värvi. Ja mõnikord saab selle asendada mõne täiesti erineva värviga.
laud 16 põhivärvi, mida kasutatakse kõigis brauserites
| Nimi | Värv | hex | (RGB) |
| Aqua (merelaine) | #00FFFF | (000,255,255) | |
| Must (must) | #000000 | (000,000,000) | |
| Sinine (sinine) | #0000FF | (000,000,255) | |
| fuksia (magenta) | #FF00FF | (255,000,255) | |
| Hall (hall) | #808080 | (128,128,128) | |
| Roheline (roheline) | #008000 | (000,128,000) | |
| Laim (heleroheline) | #00FF00 | (000,255,000) | |
| Maroon (maroon) | #800000 | (128,000,000) | |
| Merepunane (tumesinine) | #000080 | (000,000,128) | |
| Oliiv (oliiv) | #808000 | (128,128,000) | |
| Lilla (lilla) | #800080 | (128,000,128) | |
| Punane (punane) | #FF0000 | (255,000,000) | |
| Hõbe (hõbe) | #C0C0C0 | (192,192,192) | |
| Teal (hallroheline) | #008080 | (000,128,128) | |
| Valge (valge) | #FFFFFF | (255,255,255) | |
| Kollane (kollane) | #FFFF00 | (255,255,000) |
laud lilla värvid ja toonid
| Nimi | Värv | hex | (RGB) |
| Magenta (magenta) | #FFCBDB | (255,203,219) | |
| Magenta (magenta) | #FF0099 | (255,000,153) | |
| Magenta (magenta) | #F95A61 | (249,090,097) | |
| Fuksia (fuksia) | #FF00FF | (255,000,255) | |
| Mauveine (aniliini lilla) | #EF0097 | (239,000,151) | |
| Lõheroosa (oranž roosa) | #FF91A4 | (255,145,164) | |
| Cenise (magenta toon) | #DE3163 | (153,149,140) | |
| Baklažaan (baklažaan) | #990066 | (153,000,132) | |
| Lavendli põsepuna (roosakas lavendel) | #FFF0F5 | (255,240,245) | |
| Lilla (lilla) | #C8A2C8 | (200,162,200) | |
| Magenta (magenta) | #FF008F | (255,000,143) | |
| Orhidee (orhidee) | #DA70D6 | (218,112,214) | |
| Punane-violett (lilla-punane) | #C71585 | (199,021,133) | |
| Sanguine (sangviinik) | #92000A | (146,000,010) | |
| Ohakas (magenta varjund) | #D8BFD8 | (185,211,238) | |
| Violetne baklažaan (magenta toon) | #991199 | (153,017,153) | |
| Rosa vivo (rikas roosa) | #FF007F | (255,000,127) | |
| Lavendel-roos (lilla toon) | #FBA0E3 | (108,123,139) | |
| Mountbatten roosa (Mounbatten roosa) | #997ABD | (153,122,141) |
laud hall värvid ja toonid
| Nimi | Värv | hex | (RGB) |
| Hall (hall) | #808080 | (128,128,128) | |
| Hall (hall) | #bebebe | (190,190,190) | |
| (hall-toon) | #858585 | (133,133,133) | |
| Hall33 (hall-33) | #545454 | (084,084,084) | |
| (hall kiltkivi) | #708090 | (112,128,144) | |
| (Kvarts) | #99958с | (153,149,140) | |
| (Helehall) | #bbbbbb | (187,187,187) | |
| (Hõbedane) | #c0c0c0 | (192,192,192) | |
| (hall valge) | #f0f0f0 | (240,240,240) | |
| (Abdel-Kerimi habe) | #e0e0e0 | (224,224,224) | |
| Helehall (helehall) | #d3d3d3 | (211,211,211) | |
| LightStateGray () | #778899 | (119,136,153) | |
| StateGray-1 (kahvatu rukkilillesinine1) | #c6e2ff | (198,226,255) | |
| StateGray-2 (kahvatu rukkilillesinine2) | #b9d3ee | (185,211,238) | |
| Olekhall3() | #9fb6cd | (159,182,205) | |
| StateGray4() | #6c7b8b | (108,123,139) |
html-värvide tabel (palett). annab võimaluse iseseisvalt valida endale vajalik toon. Värviväärtust kuvatakse kolmes vormingus: Hex, RGB ja HSV.
- Hex koosneb kolmest kahest tähemärgi väärtusest kuueteistkümnendsüsteemis. Näiteks: #ff00b3, kus esimene numbripaar on punane, teine on roheline ja kolmas on sinine.
- RGB (RedGreenBlue) vorm on "200 100 255", mis näitab vastava tooni (punane, roheline, sinine) kogust saadud värvis.
- HSV (Hue, Saturation, Value – toon, küllastus, väärtus) – värvimudel, mille koordinaadid on:
- Toon – värvitoon, võib varieeruda 0° kuni 360°.
- Küllastus – küllastus, varieerub vahemikus 0-100 või 0-1. Mida suurem on see säte, seda "puhtam" on värv, mistõttu seda sätet nimetatakse mõnikord ka värvi puhtuseks. Ja mida lähemal on see parameeter nullile, seda lähemal on värv neutraalhallile.
- Väärtus (värviväärtus) - määrab heleduse, väärtus võib varieeruda ka vahemikus 0-100 või 0-1.
Sisesta värvikood: MINNA
Värvide loetelu koos nimedega
Tabelis on loetletud ingliskeelsed värvinimed (mida saab väärtustena kasutada), mida toetavad kõik brauserid, ja nende kuueteistkümnendsüsteemi väärtused. Kõik loetletud värvid on "ohutud", mis tähendab, et need kuvatakse kõigis brauserites ühtemoodi.
| Värvi nimi | HEX | Värv |
|---|---|---|
| Must | #000000 | |
| Merevägi | #000080 | |
| tumesinine | #00008B | |
| Keskmine sinine | #0000CD | |
| Sinine | #0000FF | |
| tumeroheline | #006400 | |
| Roheline | #008000 | |
| Sinine | #008080 | |
| Tume tsüaan | #008B8B | |
| DeepSkyBlue | #00BFFF | |
| Tume türkiissinine | #00CED1 | |
| Keskmine kevadroheline | #00FA9A | |
| lubi | #00FF00 | |
| Kevadroheline | #00FF7F | |
| Aqua | #00FFFF | |
| tsüaan | #00FFFF | |
| kesköösinine | #191970 | |
| Dodger Blue | #1E90FF | |
| HeleMereroheline | #20B2AA | |
| metsaroheline | #228B22 | |
| mereroheline | #2E8B57 | |
| Dark SlateGray | #2F4F4F | |
| Laimiroheline | #32CD32 | |
| Keskmine mereroheline | #3CB371 | |
| Türkiissinine | #40E0D0 | |
| Sügavsinine | #4169E1 | |
| terasest sinine | #4682B4 | |
| Tume kiltkivisinine | #483D8B | |
| Keskmine türkiissinine | #48D1CC | |
| Indigo | #4B0082 | |
| Tume oliivroheline | #556B2F | |
| Kadett sinine | #5F9EA0 | |
| Rukkilillesinine | #6495ED | |
| Keskmine AquaMarine | #66CDAA | |
| Hämar hall | #696969 | |
| Kiltkivi sinine | #6A5ACD | |
| OliveDrab | #6B8E23 | |
| Kiltkivihall | #708090 | |
| Hele Kiltkivihall | #778899 | |
| Keskmine kiltkivisinine | #7B68EE | |
| Mururoheline | #7CFC00 | |
| chartreuse | #7FFF00 | |
| akvamariin | #7FFFD4 | |
| kastanipunane | #800000 | |
| Lilla | #800080 | |
| Oliiv | #808000 | |
| Hall | #808080 | |
| taevasinine | #87 CEEB | |
| HeleSkyBlue | #87CEFA | |
| sinine violetne | #8A2BE2 | |
| tumepunane | #8B0000 | |
| Tume magenta | #8B008B | |
| Sadulpruun | #8B4513 | |
| TumeMereroheline | #8FBC8F | |
| Heleroheline | #90EE90 | |
| Keskmine lilla | #9370D8 | |
| tumevioletne | #9400D3 | |
| kahvaturoheline | #98FB98 | |
| Tume orhidee | #9932CC | |
| kollane roheline | # 9ACD32 | |
| Sienna | #A0522D | |
| Pruun | #A52A2A | |
| tumehall | #A9A9A9 | |
| helesinine | # ADD8E6 | |
| RohelineKollane | #ADFF2F | |
| paletürkiissinine | #TASUTA | |
| HeleSteelBlue | #B0C4DE | |
| Pulbersinine | #B0E0E6 | |
| FireBrick | #B22222 | |
| Tume Kuldvarras | #B8860B | |
| Keskmine orhidee | #BA55D3 | |
| Roosapruun | #BC8F8F | |
| tume khaki | #BDB76B | |
| Hõbedane | #C0C0C0 | |
| Keskmine violetne punane | #C71585 | |
| India punane | #CD5C5C | |
| Peruu | #CD853F | |
| Šokolaad | #D2691E | |
| Tan | #D2B48C | |
| helehall | #D3D3D3 | |
| Kahvatuvioletne punane | #D87093 | |
| Ohakas | #D8BFD8 | |
| Orhidee | #DA70D6 | |
| kuldne varras | #DAA520 | |
| karmiinpunane | #DC143C | |
| Gainsboro | #DCDCDC | |
| Ploom | #DDA0DD | |
| Burlywood | #DEB887 | |
| heletsüaan | #E0FFFF | |
| Lavendel | #E6E6FA | |
| Tume lõhe | #E9967A | |
| violetne | #EE82EE | |
| PaleGoldenRod | #EEE8AA | |
| HeleKoralli | #F08080 | |
| kaki | #F0E68C | |
| Alice Blue | #F0F8FF | |
| mesikaste | #F0FFF0 | |
| Azure | #F0FFFF | |
| Sandy Brown | #F4A460 | |
| Nisu | #F5DEB3 | |
| Beež | #F5F5DC | |
| valge suits | #F5F5F5 | |
| MintCream | #F5FFFA | |
| kummitus valge | #F8F8FF | |
| lõhe | #FA8072 | |
| antiikne valge | #FAEBD7 | |
| linane | #FAF0E6 | |
| HeleKuldne RodKollane | #FAFAD2 | |
| Vana pits | #FDF5E6 | |
| Punane | #FF0000 | |
| Fuksia | #FF00FF | |
| Magenta | #FF00FF | |
| sügavroosa | #FF1493 | |
| OranžPunane | #FF4500 | |
| Tomat | #FF6347 | |
| soe roosa | #FF69B4 | |
| Korallid | #FF7F50 | |
| tume oranž | #FF8C00 | |
| Kerge lõhe | #FFA07A | |
| Oranž | #FFA500 | |
| heleroosa | #FFB6C1 | |
| Roosa | #FFC0CB | |
| Kuldne | #FFD700 | |
| PeachPuff | #FFDAB9 | |
| Navajo Valge | #FFDEAD | |
| Mokassiin | #FFE4B5 | |
| Bisque | #FFE4C4 | |
| MistyRose | #FFE4E1 | |
| Blanšeeritud mandel | #FFEBCD | |
| Papaia piits | #FFEFD5 | |
| Lavendelpunane | #FFF0F5 | |
| merekarp | #FFF5EE | |
| Maissiid | #FFF8DC | |
| Sidrunišifoon | #FFFACD | |
| FloralWhite | #FFFAF0 | |
| Lumi | #FFFAFA | |
| Kollane | #FFFF00 | |
| Helekollane | #FFFFE0 | |
| Elevandiluu | #FFFFF0 | |
| Valge | #FFFFFF |
