mga pangalan ng kulay ng css. Maaaring itakda ang kulay sa mga istilo sa iba't ibang paraan: ayon sa hexadecimal na halaga, ayon sa pangalan, sa RGB, RGBA, HSL, HSLA na format. Mga kulay at mga code sa pag-format
Tulad ng alam mo, ang kulay ay maaaring makaapekto sa estado ng isang tao: parehong mental at pisikal. Araw-araw, nagba-browse sa Internet, sinusuri ng mga mata ang milyun-milyong kulay at lilim. Ang isang web designer na pamilyar sa sikolohiya ng kulay ay maaaring makontrol ang mood ng bisita upang makamit ang anumang mga layunin.
Ito ay dahil sa ang katunayan na ang ilang mga shade ay nagpapaginhawa, at ang ilan, sa kabaligtaran, ay nakakaganyak. Susunod, pag-uusapan natin kung paano na-synthesize at ipinapakita ang kulay gamit ang teknolohiya ng computer.
Ang RGB ay isang modelo ng kulay na kumakatawan sa isang paraan ng pagkuha ng lahat ng mga kulay at kanilang mga shade sa pamamagitan ng paghahalo sa iba't ibang proporsyon ng tatlong pangunahing bahagi, na:
- pulang kulay ( Pula);
- kulay berde ( Berde);
- asul na kulay ( Asul).
Dito nagmula ang pinaikling pangalan na RGB. Ang mga kulay na ito ay pinili bilang mga pangunahing para sa isang kadahilanan: ang dahilan ay ang pisyolohiya ng retina ng mata ng tao, at kung paano ito nakikita sa kanila:
Ang modelong RGB ay nananatiling pinakasikat ngayon at ginagamit upang magparami ng mga kulay sa mga screen ng TV at mga monitor ng computer. Dahil pinagkalooban ng mga tagagawa ang kanilang mga produkto ng iba't ibang mga katangian, noong 1996 isang pinag-isang RGB-based na color synthesis system na tinatawag na sRGB ay nilikha, na pinagtulungan ng Microsoft at HP.
Numeric na representasyon ng kulay
Tulad ng nabanggit kanina, ang mga kulay ng RGB ay nabuo sa pamamagitan ng paghahalo ng mga pangunahing kulay. Upang ilarawan ang intensity ng bawat isa sa kanila, isang scheme ang pinagtibay kung saan ang kulay ay kinakatawan ng hanay na 0-255 (8 bits), na tumutugma sa 00-FF sa hexadecimal.
Iyon ay, ang mga pangunahing kulay ay magiging ganito:
- Pula - RGB (255.0.0);
- Berde - RGB (0.255.0);
- Asul - RGB (0.0.255);
Kung ang intensity ng kulay ay tumatagal ng mga halaga na mas mababa sa 255, kung gayon ang iba't ibang mga kulay ng pula, berde at asul ay nakuha. Ang sumusunod ay isang talahanayan ng kanilang gradasyon, pati na rin ang mga halaga ng hexadecimal ng bawat isa sa mga shade:
Mga Chart ng Kulay ng RGB
Naturally, bilang karagdagan sa mga gradasyon ng mga pangunahing kulay, mayroong mga halo-halong, at ang kanilang bilang ay medyo malaki. Samakatuwid, nilikha ang isang talahanayan ng mga kulay ng RGB, kung saan ipinakita ang lahat ng umiiral na mga kulay, pati na rin ang kanilang mga pangalan at mga representasyong numero ( sa decimal at hexadecimal form).
Maaari mo siyang makilala dito. Ang talahanayang ito ay lubos na nagpapasimple sa buhay ng mga web designer, dahil sa ilang segundo ay mahahanap mo ang nais na lilim at malalaman ang numerical na representasyon nito.
Ligtas na palette ng kulay ng RGB
Gayunpaman, sa ilang mga punto ay nagkaroon ng problema sa pagpapakita ng mga kulay sa iba't ibang mga browser, at upang malutas ito, ang tinatawag na "ligtas" na palette ng mga kulay ng RGB ay pinagsama-sama, na hinango ng mga kalkulasyon ng matematika.
Kapag ang browser ay hindi makapagpakita ng isang kulay nang tama, sinusubukan nitong lumapit sa kung ano ang kailangan nito sa pamamagitan ng paghahalo ng mga kalapit na kulay, at malamang na ang resulta ay magiging ganap na hindi katanggap-tanggap:
Sa pamamagitan ng paggamit ng mga RGB color code mula sa palette na ito, maaaring magkaroon ng kapayapaan ng isip ang isang web developer tungkol sa pagpapakita ng mga kulay sa mga page ng kanilang site kapag tiningnan gamit ang iba't ibang browser, platform, at monitor. Bagaman sa ngayon ang talahanayan ng mga ligtas na kulay ay nawawala ang kaugnayan nito ( hindi tumitigil ang pag-unlad ng teknolohiya), kapag ginagamit ito, maaari mong, gaya ng sinasabi nila, matulog nang mapayapa.
Gintong kulay sa modelong RGB
Sa unang pagkakataon ang salitang "ginto" ay ginamit sa simula ng XIV na siglo upang ilarawan ang kulay ng isang kemikal na elemento na tinatawag na Aurum - ginto. Sa modelong RGB, ang kulay ng ginto ay kinakatawan ng mga sumusunod na numerong halaga:
- RGB (255, 215, 0) - decimal system;
- HEX #FFD700 - hexadecimal system.
Kulay ng beige sa modelong RGB
Ang beige ay may medyo makabuluhang lugar sa kasaysayan, kahit na hindi ito ang pinaka-nagpapahayag. Maraming mga monumento sa kultura, lalo na ang mga antigong eskultura, ay gawa sa steatite at soapstone, na may kulay na beige. Sa modelong RGB, ang beige ay may mga sumusunod na representasyong numero.
Para sa mga html na pahina, ang mga kulay ay pangunahing tinutukoy sa hexadecimal system. Para dito, dalawang uri ng pag-record ng code ang ginagamit - buo o dinaglat. Upang maipahiwatig nang tama ang kulay ng html na may isang buong tala, dapat kang sumulat ng anim na character (mga numero at / o mga letra sa Ingles) pagkatapos ng sala-sala, halimbawa, ang itim ay nakasulat nang ganito: #000000. Ang isang pinaikling notasyon para sa pagtukoy ng mga kulay ng html ay binubuo ng isang grid at tatlong numero at / o mga titik sa likod nito. Kasabay nito, ang ganitong uri ng reserba ay magagamit lamang kung ang buong talaan ng kulay na ito ay binubuo ng parehong mga character pagkatapos ng grid. Halimbawa, ang parehong itim na kulay ay maaaring isulat ng ganito: #000. Maaari mong tukuyin ang mga kulay ng html na may parehong malaki at maliit na mga character, dahil hindi sila case sensitive.
Ang bawat character na nakasulat pagkatapos ng "#" ay tumutugma sa isang tiyak na proporsyon ng pula, berde at asul na mga kulay. Sa turn, ang lahat ng mga monitor ay binubuo ng isang malaking bilang ng mga pixel (microscopic tuldok), bawat isa ay may kasamang 3 tinatawag na "flashlight" (light source): pula, berde at asul. Pagkatapos, sa pamamagitan ng pagsasaayos ng intensity ng ibinubuga na liwanag ng mga "flashlight" na ito, ipinapakita ng monitor ang kulay na kailangan natin.
Sa pamamagitan ng pagsasama-sama ng pula, asul at berdeng intensity ng liwanag (mula 0 hanggang 256) ang mga monitor ay maaaring magpakita ng 16,000,000 iba't ibang kulay.
Gayundin, ang mga kulay para sa mga site ay maaaring tukuyin sa salita o sa RGB code.
Sa ngayon, sa salita, maaari kang magreseta ng 147 mga kulay. Mahalagang malaman na ang ilang magkakaibang pangalan ay maaaring sumangguni sa parehong mga kulay, halimbawa ang Gray at Gray ay gray (#808080).
Mga ligtas na kulay para sa mga website.
Hindi lahat ng monitor at browser ay maaaring magpakita ng lahat ng 16 milyong kulay ng html nang tama.
Kung, halimbawa, may makikitang kulay na hindi maipapakita nang tama ng browser, kung gayon:
- Pinapalitan ito ng browser ng isa na pinakakatulad nito at maaaring matagumpay na kopyahin;
- Upang maipakita nang tama, maaaring paghaluin ng browser ang maraming kulay at kopyahin ang resulta.
Upang matiyak na ang output sa anumang browser at sa anumang monitor ay ang kulay na iyong tinukoy sa code, inirerekomendang gamitin ang "Mga Ligtas na Kulay". Hindi sila natukoy sa pamamagitan ng kamay o sa kalooban ng isang tao, ngunit sa matematika. Mayroong 216 ganoong 100% na ligtas na mga kulay para sa mga dokumentong html. At bagaman ang mga teknolohiya ngayon ay umabot sa punto na kinikilala ng mga modernong monitor at browser ang milyun-milyong shade, inirerekomenda namin ang paggamit ng mga ligtas na kulay na ito upang magarantiya ang pagpaparami ng kulay.
Hexadecimal na sistema ng kulay. | Mga code ng kulay sa RGB (Red, Green, Blue). |
Kulay ng html code: #000000 | Kulay ng RGB: 0 0 0 |
Kulay ng html code: #333333 | Kulay ng RGB: 51 51 51 |
Kulay ng html code: #666666 | Kulay ng RGB: 102 102 102 |
Kulay ng html code: #999999 | Kulay ng RGB: 153 153 153 |
Kulay ng html code: #CCCCCC | Kulay ng RGB: 204 204 204 |
Kulay ng html code: #FFFFFF | Kulay ng RGB: 255 255 255 |
Kulay ng html code: #666600 | Kulay ng RGB: 102 102 0 |
Kulay ng html code: #999900 | Kulay ng RGB: 153 153 0 |
Kulay ng html code: #999933 | Kulay ng RGB: 153 153 51 |
Kulay ng html code: #999966 | Kulay ng RGB: 153 153 102 |
Kulay ng html code: #CCCC33 | Kulay ng RGB: 204 204 51 |
Kulay ng html code: #CCCC66 | Kulay ng RGB: 204 204 102 |
Kulay ng html code: #333300 | Kulay ng RGB: 51 51 0 |
Kulay ng html code: #666633 | Kulay ng RGB: 102 102 51 |
Kulay ng html code: #CCCC99 | Kulay ng RGB: 204 204 153 |
Kulay ng html code: #CCFF33 | Kulay ng RGB: 204 255 51 |
Kulay ng html code: #CCFF00 | Kulay ng RGB: 204 255 0 |
Kulay ng html code: #CCFF66 | Kulay ng RGB: 204 255 102 |
Kulay ng html code: #669900 | Kulay ng RGB: 102 153 0 |
Kulay ng html code: #99CC33 | Kulay ng RGB: 153 204 51 |
Kulay ng html code: #99CC00 | Kulay ng RGB: 153 204 0 |
Kulay ng html code: #99CC66 | Kulay ng RGB: 153 204 102 |
Kulay ng html code: #99FF33 | Kulay ng RGB: 153 255 51 |
Kulay ng html code: #99FF00 | Kulay ng RGB: 153 255 0 |
Kulay ng html code: #336600 | Kulay ng RGB: 51 102 0 |
Kulay ng html code: #669933 | Kulay ng RGB: 102 153 51 |
Kulay ng html code: #66CC33 | Kulay ng RGB: 102 204 51 |
Kulay ng html code: #66CC00 | Kulay ng RGB: 102 204 0 |
Kulay ng html code: #99FF66 | Kulay ng RGB: 153 255 102 |
Kulay ng html code: #CCFF99 | Kulay ng RGB: 204 255 153 |
Kulay ng html code: #009900 | Kulay ng RGB: 0 153 0 |
Kulay ng html code: #339900 | Kulay ng RGB: 51 153 0 |
Kulay ng html code: #33CC00 | Kulay ng RGB: 51 204 0 |
Kulay ng html code: #33FF00 | Kulay ng RGB: 51 255 0 |
Kulay ng html code: #66FF33 | Kulay ng RGB: 102 255 51 |
Kulay ng html code: #66FF00 | Kulay ng RGB: 102 255 0 |
Kulay ng html code: #00CC33 | Kulay ng RGB: 0 204 51 |
Kulay ng html code: #33CC33 | Kulay ng RGB: 51 204 51 |
Kulay ng html code: #00CC00 | Kulay ng RGB: 0 204 0 |
Kulay ng html code: #00FF00 | Kulay ng RGB: 0 255 0 |
Kulay ng html code: #00FF33 | Kulay ng RGB: 0 255 51 |
Kulay ng html code: #33FF33 | Kulay ng RGB: 51 255 51 |
Kulay ng html code: #003300 | Kulay ng RGB: 0 51 0 |
Kulay ng html code: #336633 | Kulay ng RGB: 51 102 51 |
Kulay ng html code: #669966 | Kulay ng RGB: 102 153 102 |
Kulay ng html code: #66CC66 | Kulay ng RGB: 102 204 102 |
Kulay ng html code: #99CC99 | Kulay ng RGB: 153 204 153 |
Kulay ng html code: #CCFFCC | Kulay ng RGB: 204 255 204 |
Kulay ng html code: #006600 | Kulay ng RGB: 0 102 0 |
Kulay ng html code: #339933 | Kulay ng RGB: 51 153 51 |
Kulay ng html code: #00FF66 | Kulay ng RGB: 0 255 102 |
Kulay ng html code: #33FF66 | Kulay ng RGB: 51 255 102 |
Kulay ng html code: #66FF66 | Kulay ng RGB: 102 255 102 |
Kulay ng html code: #99FF99 | Kulay ng RGB: 153 255 153 |
Kulay ng html code: #009933 | Kulay ng RGB: 0 153 51 |
Kulay ng html code: #00CC66 | Kulay ng RGB: 0 204 102 |
Kulay ng html code: #33CC66 | Kulay ng RGB: 51 204 102 |
Kulay ng html code: #00FF99 | Kulay ng RGB: 0 255 153 |
Kulay ng html code: #33FF99 | Kulay ng RGB: 51 255 153 |
Kulay ng html code: #66FF99 | Kulay ng RGB: 102 255 153 |
Kulay ng html code: #006633 | Kulay ng RGB: 0 102 51 |
Kulay ng html code: #009966 | Kulay ng RGB: 0 153 102 |
Kulay ng html code: #339966 | Kulay ng RGB: 51 153 102 |
Kulay ng html code: #00CC99 | Kulay ng RGB: 0 204 153 |
Kulay ng html code: #33CC99 | Kulay ng RGB: 51 204 153 |
Kulay ng html code: #66CC99 | Kulay ng RGB: 102 204 153 |
Kulay ng html code: #009999 | Kulay ng RGB: 0 153 153 |
Kulay ng html code: #33CCCC | Kulay ng RGB: 51 204 204 |
Kulay ng html code: #00FFCC | Kulay ng RGB: 0 255 204 |
Kulay ng html code: #33FFCC | Kulay ng RGB: 51 255 204 |
Kulay ng html code: #66FFCC | Kulay ng RGB: 102 255 204 |
Kulay ng html code: #99FFCC | Kulay ng RGB: 153 255 204 |
Kulay ng html code: #00CCCC | Kulay ng RGB: 0 204 204 |
Kulay ng html code: #00FFFF | Kulay ng RGB: 0 255 255 |
Kulay ng html code: #33FFFF | Kulay ng RGB: 51 255 255 |
Kulay ng html code: #66FFFF | Kulay ng RGB: 102 255 255 |
Kulay ng html code: #99FFFF | Kulay ng RGB: 153 255 255 |
Kulay ng html code: #CCFFFF | Kulay ng RGB: 204 255 255 |
Kulay ng html code: #336666 | Kulay ng RGB: 51 102 102 |
Kulay ng html code: #006666 | Kulay ng RGB: 0 102 102 |
Kulay ng html code: #669999 | Kulay ng RGB: 102 153 153 |
Kulay ng html code: #339999 | Kulay ng RGB: 51 153 153 |
Kulay ng html code: #66CCCC | Kulay ng RGB: 102 204 204 |
Kulay ng html code: #99CCCC | Kulay ng RGB: 153 204 204 |
Kulay ng html code: #003333 | Kulay ng RGB: 0 51 51 |
Kulay ng html code: #0099CC | Kulay ng RGB: 0 153 204 |
Kulay ng html code: #3399CC | Kulay ng RGB: 51 153 204 |
Kulay ng html code: #00CCFF | Kulay ng RGB: 0 204 255 |
Kulay ng html code: #33CCFF | Kulay ng RGB: 51 204 255 |
Kulay ng html code: #66CCFF | Kulay ng RGB: 102 204 255 |
Kulay ng html code: #006699 | Kulay ng RGB: 0 102 153 |
Kulay ng html code: #336699 | Kulay ng RGB: 51 102 153 |
Kulay ng html code: #6699CC | Kulay ng RGB: 102 153 204 |
Kulay ng html code: #0099FF | Kulay ng RGB: 0 153 255 |
Kulay ng html code: #3399FF | Kulay ng RGB: 51 153 255 |
Kulay ng html code: #99CCFF | Kulay ng RGB: 153 204 255 |
Kulay ng html code: #003366 | Kulay ng RGB: 0 51 102 |
Kulay ng html code: #003399 | Kulay ng RGB: 0 51 153 |
Kulay ng html code: #0033FF | Kulay ng RGB: 0 51 255 |
Kulay ng html code: #3366CC | Kulay ng RGB: 51 102 204 |
Kulay ng html code: #0066CC | Kulay ng RGB: 0 102 204 |
Kulay ng html code: #0066FF | Kulay ng RGB: 0 102 255 |
Kulay ng html code: #000033 | Kulay ng RGB: 0 0 51 |
Kulay ng html code: #0033CC | Kulay ng RGB: 0 51 204 |
Kulay ng html code: #0000CC | Kulay ng RGB: 0 0 204 |
Kulay ng html code: #0000FF | Kulay ng RGB: 0 0 255 |
Kulay ng html code: #3366FF | Kulay ng RGB: 51 102 255 |
Kulay ng html code: #6699FF | Kulay ng RGB: 102 153 255 |
Kulay ng html code: #000066 | Kulay ng RGB: 0 0 102 |
Kulay ng html code: #000099 | Kulay ng RGB: 0 0 153 |
Kulay ng html code: #3333CC | Kulay ng RGB: 51 51 204 |
Kulay ng html code: #3300CC | Kulay ng RGB: 51 0 204 |
Kulay ng html code: #3300FF | Kulay ng RGB: 51 0 255 |
Kulay ng html code: #3333FF | Kulay ng RGB: 51 51 255 |
Kulay ng html code: #333366 | Kulay ng RGB: 51 51 102 |
Kulay ng html code: #333399 | Kulay ng RGB: 51 51 153 |
Kulay ng html code: #666699 | Kulay ng RGB: 102 102 153 |
Kulay ng html code: #6666CC | Kulay ng RGB: 102 102 204 |
Kulay ng html code: #6666FF | Kulay ng RGB: 102 102 255 |
Kulay ng html code: #9999CC | Kulay ng RGB: 153 153 204 |
Kulay ng html code: #330066 | Kulay ng RGB: 51 0 102 |
Kulay ng html code: #330099 | Kulay ng RGB: 51 0 153 |
Kulay ng html code: #6600FF | Kulay ng RGB: 102 0 255 |
Kulay ng html code: #6633FF | Kulay ng RGB: 102 51 255 |
Kulay ng html code: #9999FF | Kulay ng RGB: 153 153 255 |
Kulay ng html code: #CCCCFF | Kulay ng RGB: 204 204 255 |
Kulay ng html code: #330033 | Kulay ng RGB: 51 0 51 |
Kulay ng html code: #663399 | Kulay ng RGB: 102 51 153 |
Kulay ng html code: #6633CC | Kulay ng RGB: 102 51 204 |
Kulay ng html code: #6600CC | Kulay ng RGB: 102 0 204 |
Kulay ng html code: #9966FF | Kulay ng RGB: 153 102 255 |
Kulay ng html code: #9966CC | Kulay ng RGB: 153 102 204 |
Kulay ng html code: #663366 | Kulay ng RGB: 102 51 102 |
Kulay ng html code: #660099 | Kulay ng RGB: 102 0 153 |
Kulay ng html code: #9900FF | Kulay ng RGB: 153 0 255 |
Kulay ng html code: #9933FF | Kulay ng RGB: 153 51 255 |
Kulay ng html code: #9933CC | Kulay ng RGB: 153 51 204 |
Kulay ng html code: #CC99FF | Kulay ng RGB: 204 153 255 |
Kulay ng html code: #660066 | Kulay ng RGB: 102 0 102 |
Kulay ng html code: #996699 | Kulay ng RGB: 153 102 153 |
Kulay ng html code: #9900CC | Kulay ng RGB: 153 0 204 |
Kulay ng html code: #CC00FF | Kulay ng RGB: 204 0 255 |
Kulay ng html code: #CC33FF | Kulay ng RGB: 204 51 255 |
Kulay ng html code: #CC66FF | Kulay ng RGB: 204 102 255 |
Kulay ng html code: #993399 | Kulay ng RGB: 153 51 153 |
Kulay ng html code: #990099 | Kulay ng RGB: 153 0 153 |
Kulay ng html code: #CC33CC | Kulay ng RGB: 204 51 204 |
Kulay ng html code: #CC00CC | Kulay ng RGB: 204 0 204 |
Kulay ng html code: #CC66CC | Kulay ng RGB: 204 102 204 |
Kulay ng html code: #CC99CC | Kulay ng RGB: 204 153 204 |
Kulay ng html code: #CC3399 | Kulay ng RGB: 204 51 153 |
Kulay ng html code: #FF00FF | Kulay ng RGB: 255 0 255 |
Kulay ng html code: #FF33FF | Kulay ng RGB: 255 51 255 |
Kulay ng html code: #FF66FF | Kulay ng RGB: 255 102 255 |
Kulay ng html code: #FF99FF | Kulay ng RGB: 255 153 255 |
Kulay ng html code: #FFCCFF | Kulay ng RGB: 255 204 255 |
Kulay ng html code: #990066 | Kulay ng RGB: 153 0 102 |
Kulay ng html code: #CC0099 | Kulay ng RGB: 204 0 153 |
Kulay ng html code: #CC6699 | Kulay ng RGB: 204 102 153 |
Kulay ng html code: #FF33CC | Kulay ng RGB: 255 51 204 |
Kulay ng html code: #FF00CC | Kulay ng RGB: 255 0 204 |
Kulay ng html code: #FF66CC | Kulay ng RGB: 255 102 204 |
Kulay ng html code: #660033 | Kulay ng RGB: 102 0 51 |
Kulay ng html code: #993366 | Kulay ng RGB: 153 51 102 |
Kulay ng html code: #CC0066 | Kulay ng RGB: 204 0 102 |
Kulay ng html code: #FF0099 | Kulay ng RGB: 255 0 153 |
Kulay ng html code: #FF3399 | Kulay ng RGB: 255 51 153 |
Kulay ng html code: #FF99CC | Kulay ng RGB: 255 153 204 |
Kulay ng html code: #663333 | Kulay ng RGB: 102 51 51 |
Kulay ng html code: #996666 | Kulay ng RGB: 153 102 102 |
Kulay ng html code: #CC3366 | Kulay ng RGB: 204 51 102 |
Kulay ng html code: #FF0066 | Kulay ng RGB: 255 0 102 |
Kulay ng html code: #FF3366 | Kulay ng RGB: 255 51 102 |
Kulay ng html code: #FF6699 | Kulay ng RGB: 255 102 153 |
Kulay ng html code: #330000 | Kulay ng RGB: 51 0 0 |
Kulay ng html code: #990033 | Kulay ng RGB: 153 0 51 |
Kulay ng html code: #993333 | Kulay ng RGB: 153 51 51 |
Kulay ng html code: #CC3333 | Kulay ng RGB: 204 51 51 |
Kulay ng html code: #CC6666 | Kulay ng RGB: 204 102 102 |
Kulay ng html code: #CC9999 | Kulay ng RGB: 204 153 153 |
Kulay ng html code: #CC0033 | Kulay ng RGB: 204 0 51 |
Kulay ng html code: #FF0033 | Kulay ng RGB: 255 0 51 |
Kulay ng html code: #FF3333 | Kulay ng RGB: 255 51 51 |
Kulay ng html code: #FF6666 | Kulay ng RGB: 255 102 102 |
Kulay ng html code: #FF9999 | Kulay ng RGB: 255 153 153 |
Kulay ng html code: #FFCCCC | Kulay ng RGB: 255 204 204 |
Kulay ng html code: #990000 | Kulay ng RGB: 153 0 0 |
Kulay ng html code:#CC0000 | Kulay ng RGB: 204 0 0 |
Kulay ng html code: #FF0000 | Kulay ng RGB: 255 0 0 |
Kulay ng html code: #FF3300 | Kulay ng RGB: 255 51 0 |
Kulay ng html code: #CC3300 | Kulay ng RGB: 204 51 0 |
Kulay ng html code: #FF6633 | Kulay ng RGB: 255 102 51 |
Kulay ng html code: #660000 | Kulay ng RGB: 102 0 0 |
Kulay ng html code: #993300 | Kulay ng RGB: 153 51 0 |
Kulay ng html code: #CC6633 | Kulay ng RGB: 204 102 51 |
Kulay ng html code: #FF6600 | Kulay ng RGB: 255 102 0 |
Kulay ng html code: #FF9966 | Kulay ng RGB: 255 153 102 |
Kulay ng html code: #FFCC99 | Kulay ng RGB: 255 204 153 |
Kulay ng html code: #663300 | Kulay ng RGB: 102 51 0 |
Kulay ng html code: #996633 | Kulay ng RGB: 153 102 51 |
Kulay ng html code: #CC6600 | Kulay ng RGB: 204 102 0 |
Kulay ng html code: #CC9966 | Kulay ng RGB: 204 153 102 |
Kulay ng html code: #FF9933 | Kulay ng RGB: 255 153 51 |
Kulay ng html code: #FF9900 | Kulay ng RGB: 255 153 0 |
Kulay ng html code: #996600 | Kulay ng RGB: 153 102 0 |
Kulay ng html code: #CC9933 | Kulay ng RGB: 204 153 51 |
Kulay ng html code: #CC9900 | Kulay ng RGB: 204 153 0 |
Kulay ng html code: #FFCC33 | Kulay ng RGB: 255 204 51 |
Kulay ng html code: #FFCC00 | Kulay ng RGB: 255 204 0 |
Kulay ng html code: #FFCC66 | Kulay ng RGB: 255 204 102 |
Kulay ng html code: #CCCC00 | Kulay ng RGB: 204 204 0 |
Kulay ng html code: #FFFF00 | Kulay ng RGB: 255 255 0 |
Kulay ng html code: #FFFF33 | Kulay ng RGB: 255 255 51 |
Kulay ng html code: #FFFF66 | Kulay ng RGB: 255 255 102 |
Kulay ng html code: #FFFF99 | Kulay ng RGB: 255 255 153 |
Kulay ng html code: #FFFFCC | Kulay ng RGB: 255 255 204 |
Kasama sa talahanayang ito ang 216 ligtas na mga code ng kulay ng html. Ang bawat kulay ay may halaga sa RGB upang tukuyin ang kulay sa mga graphic editor at HEX upang tukuyin ang kulay sa mga html na pahina.
Mayroong ilang mga paraan upang kumatawan sa kulay sa disenyo ng web.
Ang HEX ay isang hexadecimal system para sa kumakatawan sa mga kulay sa base 16. Para sa sistemang ito, Arabic decimal digit mula 0 hanggang 9 at Latin na mga letra mula A hanggang F ay ginagamit upang umakma sa digital na numero hanggang 16. Para sa web design, 16 primary (key) na kulay , ang tinatawag na hexadecimal color code #RRGGBB, kung saan ang bawat pares ay may pananagutan sa bahagi ng kulay nito: RR - pula, GG - berde at BB - asul. Ang bawat bahagi ng kulay ay mula 00 hanggang FF.
Dalawang iba pang mga representasyon ng kulay sa disenyo ng web ay: sa anyo ng RGB(*,*,*), kung saan ang bawat "*" bahagi ng kulay ay kinakatawan ng mga decimal na digit mula 0 hanggang 255 at ng mga pangalan ng kulay sa English.
Kapag lumilikha ng isang kulay na imahe, ang pangunahing problema ay ang tamang pagpaparami ng mga kulay sa iba't ibang uri ng mga computer, monitor at browser. Kung ang browser ay hindi makapag-render ng isang kulay nang tama, ito ay tumutugma o naghahalo ng maraming kulay. At kung minsan maaari itong mapalitan ng ilang ganap na magkakaibang kulay.
mesa 16 pangunahing kulay, na ginagamit sa lahat ng browser
Pangalan | Kulay | hex | (RGB) |
Aqua (alon ng dagat) | #00FFFF | (000,255,255) | |
Itim (itim) | #000000 | (000,000,000) | |
Asul (asul) | #0000FF | (000,000,255) | |
Fuchsia (magenta) | #FF00FF | (255,000,255) | |
kulay abo (grey) | #808080 | (128,128,128) | |
Berde (berde) | #008000 | (000,128,000) | |
Lime (matingkad na berde) | #00FF00 | (000,255,000) | |
Maroon (maroon) | #800000 | (128,000,000) | |
Navy (madilim na asul) | #000080 | (000,000,128) | |
Olive (olive) | #808000 | (128,128,000) | |
Lila (purple) | #800080 | (128,000,128) | |
Pula (pula) | #FF0000 | (255,000,000) | |
pilak (pilak) | #C0C0C0 | (192,192,192) | |
Teal (kulay abong berde) | #008080 | (000,128,128) | |
Puti (puti) | #FFFFFF | (255,255,255) | |
Dilaw (dilaw) | #FFFF00 | (255,255,000) |
mesa lila mga kulay at lilim
Pangalan | Kulay | hex | (RGB) |
Magenta (magenta) | #FFCBDB | (255,203,219) | |
Magenta (magenta) | #FF0099 | (255,000,153) | |
Magenta (magenta) | #F95A61 | (249,090,097) | |
Fuchsia (fuchsia) | #FF00FF | (255,000,255) | |
Mauveine (aniline purple) | #EF0097 | (239,000,151) | |
Salmon pink (orange pink) | #FF91A4 | (255,145,164) | |
Cenise (isang lilim ng magenta) | #DE3163 | (153,149,140) | |
Aubergine Eggplant (Talong) | #990066 | (153,000,132) | |
Lavender blush (pinkish lavender) |  #FFF0F5 | (255,240,245) | |
Lilac (lilac) | #C8A2C8 | (200,162,200) | |
Magenta (magenta) | #FF008F | (255,000,143) | |
Orchid (orchid) | #DA70D6 | (218,112,214) | |
Pula-lila (purple-red) | #C71585 | (199,021,133) | |
Sanguine (sanguine) | #92000A | (146,000,010) | |
Thistle (isang lilim ng magenta) | #D8BFD8 | (185,211,238) | |
Violet-eggplant (isang lilim ng magenta) | #991199 | (153,017,153) | |
Rosa vivo (rich pink) | #FF007F | (255,000,127) | |
Lavender-rose (isang lilim ng lila) | #FBA0E3 | (108,123,139) | |
Mountbatten pink (Mounbatten pink) | #997ABD | (153,122,141) |
mesa kulay-abo mga kulay at lilim
Pangalan | Kulay | hex | (RGB) |
Gray (Gray) | #808080 | (128,128,128) | |
Gray (Gray) | #bebebe | (190,190,190) | |
(kulay abo) | #858585 | (133,133,133) | |
Gray33 (Gray-33) | #545454 | (084,084,084) | |
(grey slate) | #708090 | (112,128,144) | |
(Kuwarts) | #99958с | (153,149,140) | |
(Maliwanag na kulay abo) | #bbbbbb | (187,187,187) | |
(Pilak) | #c0c0c0 | (192,192,192) | |
(grey white) | #f0f0f0 | (240,240,240) | |
(Mga balbas ni Abdel-Kerim) | #e0e0e0 | (224,224,224) | |
Light Gray (Maliwanag na Gray) | #d3d3d3 | (211,211,211) | |
LightStateGray() | #778899 | (119,136,153) | |
StateGray-1 (Pale cornflower blue1) | #c6e2ff | (198,226,255) | |
StateGray-2 (Pale cornflower blue2) | #b9d3ee | (185,211,238) | |
StateGray3() | #9fb6cd | (159,182,205) | |
StateGray4() | #6c7b8b | (108,123,139) |
Ginagamit ang mga color code sa CSS upang tukuyin ang mga kulay. Kadalasan, ginagamit ang mga color code o mga value ng kulay upang magtakda ng kulay para sa alinman sa foreground ng isang elemento (hal., text, kulay ng link) o background ng elemento (background, kulay ng block). Magagamit din ang mga ito upang baguhin ang kulay ng button, mga hangganan, marker, hover at iba pang mga pandekorasyon na epekto.
Maaari mong itakda ang iyong mga halaga ng kulay sa iba't ibang mga format. Inililista ng sumusunod na talahanayan ang lahat ng posibleng mga format:
Ang mga format na ito ay inilalarawan nang mas detalyado sa ibaba.
Mga Kulay ng CSS - Mga Hex Code
Hexadecimal na code ng kulay ay isang anim na digit na representasyon ng kulay. Ang unang dalawang digit (RR) ay ang pulang halaga, ang susunod na dalawa ay ang berdeng halaga (GG) at ang huling dalawa ay ang asul na halaga (BB).
Mga Kulay ng CSS - Maikling Hex Code
Maikling hexadecimal na code ng kulay ay isang mas maikling anyo ng anim na karakter na notasyon. Sa format na ito, inuulit ang bawat digit upang makagawa ng katumbas na anim na digit na halaga ng kulay. Halimbawa: ang #0F0 ay nagiging #00FF00.
Maaaring kunin ang hexadecimal value mula sa anumang graphics software gaya ng Adobe Photoshop, Core Draw, atbp.
Ang bawat hexadecimal color code sa CSS ay mauunahan ng "#" hash sign. Ang mga sumusunod ay mga halimbawa ng paggamit ng hexadecimal notation.
Mga Kulay ng CSS - Mga Halaga ng RGB
Halaga ng RGB ay isang color code na nakatakda gamit ang rgb() property. Ang property na ito ay tumatagal ng tatlong value: isa bawat isa para sa pula, berde, at asul. Ang halaga ay maaaring isang integer, mula 0 hanggang 255, o isang porsyento.
Tandaan: Hindi lahat ng browser ay sumusuporta sa rgb() color property, kaya hindi inirerekomenda na gamitin ito.
Nasa ibaba ang isang halimbawa na nagpapakita ng maraming kulay gamit ang mga halaga ng RGB.
Generator ng color code
Maaari kang lumikha ng milyon-milyong mga code ng kulay sa aming serbisyo.
Mga Kulay ng Ligtas na Browser
Nasa ibaba ang isang talahanayan ng 216 na kulay na pinaka-secure at independiyenteng computer. Ang mga kulay na ito sa CSS ay mula 000000 hanggang FFFFFF hex code. Ligtas silang gamitin dahil tinitiyak nila na ang lahat ng mga computer ay magpapakita ng kulay nang tama kapag nagtatrabaho sa 256 color palette.
Talaan ng "ligtas" na mga kulay sa 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 |
Talahanayan (palette) ng mga kulay ng html ay nagbibigay sa iyo ng pagkakataong malayang pumili ng tono na kailangan mo. Ang halaga ng kulay ay ipinapakita sa tatlong mga format: Hex, RGB, at HSV.
- Ang Hex ay binubuo ng tatlong dalawang halaga ng character sa hexadecimal notation. Halimbawa: #ff00b3, kung saan ang unang pares ng mga numero ay pula, ang pangalawa ay berde, at ang pangatlo ay asul.
- Ang RGB (RedGreenBlue) ay may anyo na "200,100,255" na nagsasaad ng dami ng katumbas na tono (pula, berde, asul) sa resultang kulay.
- HSV (Hue, Saturation, Value - tono, saturation, value) - isang modelo ng kulay kung saan ang mga coordinate ay:
- Hue - tono ng kulay, maaaring mag-iba mula 0° hanggang 360°.
- Saturation - saturation, nag-iiba sa pagitan ng 0-100 o 0-1. Kung mas malaki ang setting na ito, mas "purer" ang kulay, kaya kung minsan ang setting na ito ay tinutukoy bilang color purity. At mas malapit ang parameter na ito sa zero, mas malapit ang kulay sa neutral na kulay abo.
- Halaga (halaga ng kulay) - nagtatakda ng liwanag, ang halaga ay maaari ding mag-iba sa pagitan ng 0-100 o 0-1.
Ipasok ang code ng kulay: GO
Listahan ng mga kulay na may mga pangalan
Inililista ng talahanayan ang mga pangalan ng kulay ng Ingles (na maaaring magamit bilang mga halaga) na sinusuportahan ng lahat ng mga browser at ang kanilang mga hexadecimal na halaga. Ang lahat ng mga kulay na nakalista ay "ligtas", ibig sabihin ay pareho silang ipapakita sa lahat ng mga browser.
Pangalan ng kulay | HEX | Kulay |
---|---|---|
Itim | #000000 | |
hukbong-dagat | #000080 | |
madilim na asul | #00008B | |
Katamtamang Asul | #0000CD | |
Asul | #0000FF | |
madilim na berde | #006400 | |
Berde | #008000 | |
Teal | #008080 | |
DarkCyan | #008B8B | |
DeepSkyBlue | #00BFFF | |
Madilim na Turkesa | #00CED1 | |
MediumSpringGreen | #00FA9A | |
kalamansi | #00FF00 | |
SpringGreen | #00FF7F | |
Aqua | #00FFFF | |
cyan | #00FFFF | |
midnight blue | #191970 | |
Dodger Blue | #1E90FF | |
LightSeaGreen | #20B2AA | |
kagubatan berde | #228B22 | |
berdeng dagat | #2E8B57 | |
DarkSlateGray | #2F4F4F | |
Lime Green | #32CD32 | |
Medium SeaGreen | #3CB371 | |
Turkesa | #40E0D0 | |
Royal Blue | #4169E1 | |
asul na bakal | #4682B4 | |
DarkSlateBlue | #483D8B | |
Katamtamang Turquoise | #48D1CC | |
Indigo | #4B0082 | |
DarkOliveGreen | #556B2F | |
Kadete Blue | #5F9EA0 | |
Bulaklak ng maisAsul | #6495ED | |
MediumAquaMarine | #66CDAA | |
Dim Gray | #696969 | |
Slate Blue | #6A5ACD | |
OliveDrab | #6B8E23 | |
SlateGray | #708090 | |
LightSlateGray | #778899 | |
MediumSlateBlue | #7B68EE | |
Lawn Green | #7CFC00 | |
chartreuse | #7FFF00 | |
aquamarine | #7FFFD4 | |
maroon | #800000 | |
Lila | #800080 | |
Olive | #808000 | |
kulay-abo | #808080 | |
asul na langit | #87CEEB | |
LightSkyBlue | #87CEFA | |
Blue violet | #8A2BE2 | |
madilim na pula | #8B0000 | |
DarkMagenta | #8B008B | |
SaddleBrown | #8B4513 | |
DarkSeaGreen | #8FBC8F | |
Banayad na Berde | #90EE90 | |
Katamtamang Lila | #9370D8 | |
madilim na kulay-lila | #9400D3 | |
maputlang berde | #98FB98 | |
Maitim na Orchid | #9932CC | |
dilaw na berde | #9ACD32 | |
Sienna | #A0522D | |
kayumanggi | #A52A2A | |
madilim na kulay-abo | #A9A9A9 | |
mapusyaw na asul | #ADD8E6 | |
Berdeng dilaw | #ADFF2F | |
paleturquoise | #AFEEEE | |
LightSteelBlue | #B0C4DE | |
Asul na pulbos | #B0E0E6 | |
firebrick | #B22222 | |
DarkGoldenRod | #B8860B | |
Katamtamang Orchid | #BA55D3 | |
RosyBrown | #BC8F8F | |
DarkKhaki | #BDB76B | |
pilak | #C0C0C0 | |
MediumVioletRed | #C71585 | |
IndianRed | #CD5C5C | |
Peru | #CD853F | |
tsokolate | #D2691E | |
kulay-balat | #D2B48C | |
mapusyaw na kulay abo | #D3D3D3 | |
PaleVioletRed | #D87093 | |
Thistle | #D8BFD8 | |
Orchid | #DA70D6 | |
gintong baras | #DAA520 | |
Crimson | #DC143C | |
Gainsboro | #DCDCDC | |
Plum | #DDA0DD | |
Burlywood | #DEB887 | |
LightCyan | #E0FFFF | |
Lavender | #E6E6FA | |
DarkSalmon | #E9967A | |
violet | #EE82EE | |
PaleGoldenRod | #EEE8AA | |
LightCoral | #F08080 | |
Khaki | #F0E68C | |
Alice Blue | #F0F8FF | |
pulot-pukyutan | #F0FFF0 | |
Azure | #F0FFFF | |
Sandy Brown | #F4A460 | |
trigo | #F5DEB3 | |
Beige | #F5F5DC | |
puting usok | #F5F5F5 | |
MintCream | #F5FFFA | |
multo puti | #F8F8FF | |
Salmon | #FA8072 | |
antigong puti | #FAEBD7 | |
linen | #FAF0E6 | |
LightGoldenRodDilaw | #FAFAD2 | |
Old Lace | #FDF5E6 | |
Pula | #FF0000 | |
Fuchsia | #FF00FF | |
Magenta | #FF00FF | |
deeppink | #FF1493 | |
Kahel na Pula | #FF4500 | |
kamatis | #FF6347 | |
hotpink | #FF69B4 | |
Coral | #FF7F50 | |
darkorange | #FF8C00 | |
LightSalmon | #FFA07A | |
Kahel | #FFA500 | |
lightpink | #FFB6C1 | |
Rosas | #FFC0CB | |
ginto | #FFD700 | |
PeachPuff | #FFDAB9 | |
NavajoWhite | #FFDEAD | |
Moccasin | #FFE4B5 | |
Bisque | #FFE4C4 | |
MistyRose | #FFE4E1 | |
Pinaputi na Almond | #FFEBCD | |
Papaya Whip | #FFEFD5 | |
LavenderBlush | #FFF0F5 | |
kabibi | #FFF5EE | |
Cornsilk | #FFF8DC | |
LemonChiffon | #FFFACD | |
FloralWhite | #FFFFAF0 | |
Niyebe | #FFAFA | |
Dilaw | #FFFF00 | |
Banayad na Dilaw | #FFFFE0 | |
Ivory | #FFFFF0 | |
Puti | #FFFFFF |