წითელი ფერი rgb პალიტრაში. HTML გაკვეთილი. RGB ფერები. უსაფრთხო პალიტრა ფერები. RGB-ის გამოყენება
HTML-ში ფერი შეიძლება განისაზღვროს სამი გზით:
HTML-ში ფერის დაყენება მისი სახელით
ზოგიერთი ფერის მითითება შესაძლებელია მათი სახელით, ფერის სახელის გამოყენებით ინგლისური. ყველაზე გავრცელებული საკვანძო სიტყვები: შავი, თეთრი, წითელი, მწვანე, ლურჯი და ა.შ.:
ტექსტის ფერი – წითელი
კონსორციუმის სტანდარტის ყველაზე პოპულარული ფერები მსოფლიო ქსელი(ინგლ. მსოფლიო ფართო ქსელიკონსორციუმი, W3C):
ფერი | სახელი | ფერი | სახელი | ფერი | სახელი | ფერი | სახელი |
---|---|---|---|---|---|---|---|
შავი | რუხი | ვერცხლი | თეთრი | ||||
ყვითელი | ცაცხვი | აკვა | ფუქსია | ||||
წითელი | მწვანე | ლურჯი | მეწამული | ||||
მარუნი | ზეთისხილის | საზღვაო ძალები | ჩაისფერი |
სხვადასხვა ფერის სახელების გამოყენების მაგალითი:
მაგალითი: ფერის მითითება მისი სახელით
- თავად სცადე »
სათაური წითელ ფონზე
სათაური ნარინჯისფერ ფონზე
სათაური ცაცხვის ფონზე
თეთრი ტექსტი ლურჯ ფონზე
სათაური წითელ ფონზე
სათაური ნარინჯისფერ ფონზე
სათაური ცაცხვის ფონზე
თეთრი ტექსტი ლურჯ ფონზე
ფერის დაზუსტება RGB-ის გამოყენებით
მონიტორზე სხვადასხვა ფერის ჩვენებისას საფუძვლად გამოიყენება RGB პალიტრა. ნებისმიერი ფერი მიიღება სამი ძირითადი ფერის შერევით: R - წითელი, G - მწვანე, B - ლურჯი. თითოეული ფერის სიკაშკაშე მოცემულია ერთი ბაიტით და, შესაბამისად, შეუძლია მიიღოს მნიშვნელობები 0-დან 255-მდე. მაგალითად, RGB(255,0,0) ნაჩვენებია წითლად, რადგან წითელი დაყენებულია მის უმაღლეს მნიშვნელობაზე (255) და დანარჩენი დაყენებულია 0-ზე, ასევე შეგიძლიათ დააყენოთ ფერი პროცენტულად. თითოეული პარამეტრი მიუთითებს შესაბამისი ფერის სიკაშკაშის დონეს. მაგალითად: rgb(127, 255, 127) და rgb (50%, 100%, 50%) მნიშვნელობები იგივე იქნება მწვანესაშუალო გაჯერება:
მაგალითი: ფერის დაზუსტება RGB-ის გამოყენებით
- თავად სცადე »
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
დააყენეთ ფერი თექვსმეტობითი მნიშვნელობით
ღირებულებები რ გ ბასევე შეიძლება მითითებული იყოს თექვსმეტობითი (HEX) ფერის მნიშვნელობების გამოყენებით: #RRGGBB, სადაც RR (წითელი), GG (მწვანე) და BB (ლურჯი) არის თექვსმეტობითი მნიშვნელობები 00-დან FF-მდე (იგივე ათწილადი 0-255 ) . თექვსმეტობითი სისტემა, ათწილადი სისტემისგან განსხვავებით, ეფუძნება, როგორც მისი სახელიდან ჩანს, რიცხვი 16. თექვსმეტობითი სისტემა იყენებს შემდეგ ნიშნებს: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. აქ 10-დან 15-მდე რიცხვები შეიცვალა ლათინური ასოებით. 15 დიუმზე მეტი რიცხვები თექვსმეტობითი სისტემაწარმოადგენს ორი სიმბოლოს ერთ მნიშვნელობის გაერთიანებას. მაგალითად, ყველაზე დიდი რაოდენობა 255 ვ ათობითი სისტემაშეესაბამება უმაღლეს FF მნიშვნელობას თექვსმეტობით. ათობითი სისტემისგან განსხვავებით, თექვსმეტობით რიცხვს წინ უძღვის ჰეშის სიმბოლო. # მაგალითად, #FF0000 ნაჩვენებია წითლად, რადგან წითელი დაყენებულია მის უმაღლეს მნიშვნელობაზე (FF), ხოლო დანარჩენი ფერები დაყენებულია მათ მინიმალურ მნიშვნელობაზე (00). ნიშნები ჰეშის სიმბოლოს შემდეგ # შეგიძლიათ აკრიფოთ როგორც დიდი, ასევე პატარა. თექვსმეტობითი სისტემა საშუალებას გაძლევთ გამოიყენოთ შემოკლებული ფორმა #rgb, სადაც თითოეული სიმბოლო უდრის ორმაგს. ამრიგად, ჩანაწერი #f7O უნდა ჩაითვალოს როგორც #ff7700.
მაგალითი: HEX ფერი
- თავად სცადე »
წითელი: #FF0000
მწვანე: #00FF00
ლურჯი: #0000FF
წითელი: #FF0000
მწვანე: #00FF00
ლურჯი: #0000FF
წითელი+მწვანე=ყვითელი: #FFFF00
წითელი+ლურჯი=იისფერი: #FF00FF
მწვანე+ლურჯი=ცისფერი: #00FFFF
საერთო ფერების სია (სახელი, HEX და RGB):
ინგლისური სახელი | რუსული სახელი | ნიმუში | HEX | RGB | ||
---|---|---|---|---|---|---|
ამარანტი | ამარანტი | #E52B50 | 229 | 43 | 80 | |
ქარვა | ქარვა | #FFBF00 | 255 | 191 | 0 | |
აკვა | ლურჯი-მწვანე | #00FFFF | 0 | 255 | 255 | |
ცისფერი | ცისფერი | #007FFF | 0 | 127 | 255 | |
შავი | შავი | #000000 | 0 | 0 | 0 | |
ლურჯი | ლურჯი | #0000FF | 0 | 0 | 255 | |
ბონდი ლურჯი | ბონდის პლაჟის წყალი | #0095B6 | 0 | 149 | 182 | |
თითბერი | თითბერი | #B5A642 | 181 | 166 | 66 | |
ყავისფერი | ყავისფერი | #964B00 | 150 | 75 | 0 | |
ცერულეანი | ცისფერი | #007BA7 | 0 | 123 | 167 | |
მუქი გაზაფხულის მწვანე | მუქი გაზაფხულის მწვანე | #177245 | 23 | 114 | 69 | |
ზურმუხტი | ზურმუხტი | #50C878 | 80 | 200 | 120 | |
ბადრიჯანი | ბადრიჯანი | #990066 | 153 | 0 | 102 | |
ფუქსია | ფუქსია | #FF00FF | 255 | 0 | 255 | |
ოქრო | ოქრო | #FFD700 | 250 | 215 | 0 | |
რუხი | ნაცრისფერი | #808080 | 128 | 128 | 128 | |
მწვანე | მწვანე | #00FF00 | 0 | 255 | 0 | |
ინდიგო | ინდიგო | #4B0082 | 75 | 0 | 130 | |
ჯეიდი | ჯეიდი | #00A86B | 0 | 168 | 107 | |
ცაცხვი | ცაცხვი | #CCFF00 | 204 | 255 | 0 | |
მალაქიტი | მალაქიტი | #0BDA51 | 11 | 218 | 81 | |
საზღვაო ძალები | მუქი ლურჯი | #000080 | 0 | 0 | 128 | |
ოხერი | ოხერი | #CC7722 | 204 | 119 | 34 | |
ზეთისხილის | ზეთისხილის | #808000 | 128 | 128 | 0 | |
ნარინჯისფერი | ნარინჯისფერი | #FFA500 | 255 | 165 | 0 | |
ატამი | ატამი | #FFE5B4 | 255 | 229 | 180 | |
გოგრა | გოგრა | #FF7518 | 255 | 117 | 24 | |
მეწამული | იისფერი | #800080 | 128 | 0 | 128 | |
წითელი | წითელი | #FF0000 | 255 | 0 | 0 | |
ზაფრანა | ზაფრანა | #F4C430 | 244 | 196 | 48 | |
ზღვის მწვანე | მწვანე ზღვა | #2E8B57 | 46 | 139 | 87 | |
ჭაობის მწვანე | ბოლოტნი | #ACB78E | 172 | 183 | 142 | |
ჩაისფერი | ლურჯი-მწვანე | #008080 | 0 | 128 | 128 | |
ულტრამარინი | ულტრამარინი | #120A8F | 18 | 10 | 143 | |
იისფერი | იისფერი | #8B00FF | 139 | 0 | 255 | |
ყვითელი | ყვითელი | #FFFF00 | 255 | 255 | 0 |
ფერის კოდები (ფონი) გაჯერების და შეფერილობის მიხედვით.
ვლად მერჟევიჩი
HTML-ში ფერი მითითებულია ორიდან ერთი გზით: თექვსმეტობითი კოდის გამოყენებით და გარკვეული ფერების სახელით. თექვსმეტობით რიცხვთა სისტემაზე დაფუძნებული მეთოდი უპირატესად გამოიყენება, რადგან ის ყველაზე უნივერსალურია.
თექვსმეტობითი ფერები
HTML იყენებს თექვსმეტობით ციფრებს ფერების დასაზუსტებლად. თექვსმეტობითი სისტემა, განსხვავებით ათობითი სისტემისგან, ეფუძნება, როგორც მისი სახელიდან ჩანს, რიცხვი 16. რიცხვები იქნება შემდეგი: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A. , B, C , D, E, F. რიცხვები 10-დან 15-მდე იცვლება ლათინური ასოებით. მაგიდაზე 6.1 გვიჩვენებს შესაბამისობას ათობითი და თექვსმეტობით რიცხვებს შორის.
თექვსმეტობით სისტემაში 15-ზე მეტი რიცხვები იქმნება ორი რიცხვის ერთში გაერთიანებით (ცხრილი 6.2). მაგალითად, რიცხვი 255 ათწილადში შეესაბამება რიცხვს FF თექვსმეტობით.
რიცხვების სისტემის განსაზღვრისას დაბნეულობის თავიდან ასაცილებლად, თექვსმეტობით რიცხვს წინ უძღვის ჰეშის სიმბოლო #, მაგალითად, #aa69cc. ამ შემთხვევაში საქმეს მნიშვნელობა არ აქვს, ამიტომ დასაშვებია #F0F0F0 ან #f0f0f0 ჩაწერა.
HTML-ში გამოყენებული ტიპიური ფერი ასე გამოიყურება.
აქ ვებგვერდის ფონის ფერი დაყენებულია #FA8E47. ჰეშის სიმბოლო # რიცხვის წინ ნიშნავს, რომ ის არის თექვსმეტობითი. პირველი ორი ციფრი (FA) განსაზღვრავს ფერის წითელ კომპონენტს, მესამედან მეოთხე ციფრით (8E) განსაზღვრავს მწვანე კომპონენტს, ხოლო ბოლო ორი ციფრი (47) განსაზღვრავს ლურჯ კომპონენტს. საბოლოო შედეგი იქნება ეს ფერი.
ფ.ა. | + | 8E | + | 47 | = | FA8E47 |
სამი ფერიდან თითოეულს - წითელს, მწვანეს და ლურჯს - შეუძლია მიიღოს მნიშვნელობები 00-დან FF-მდე, რის შედეგადაც სულ 256 ჩრდილია. ამრიგად, ფერების საერთო რაოდენობა შეიძლება იყოს 256x256x256 = 16,777,216 კომბინაცია. წითელ, მწვანე და ლურჯ კომპონენტებზე დაფუძნებულ ფერთა მოდელს ეწოდება RGB (წითელი, მწვანე, ლურჯი). ეს მოდელი არის დანამატი (დან დამატება - დამატება), რომელშიც სამივე კომპონენტის დამატება ყალიბდება თეთრი.
თექვსმეტობითი ფერების ნავიგაციის გასაადვილებლად, გაითვალისწინეთ რამდენიმე წესი.
- თუ ფერის კომპონენტების მნიშვნელობები იგივეა (მაგალითად: #D6D6D6), მაშინ შედეგი იქნება ნაცრისფერი ჩრდილი. როგორ უფრო დიდი რაოდენობარაც უფრო ღიაა ფერი, მნიშვნელობებით #000000 (შავი)-დან #FFFFFF-მდე (თეთრი).
- ნათელი წითელი ფერიიქმნება, თუ წითელი კომპონენტი გაკეთდება მაქსიმუმ (FF) და დარჩენილი კომპონენტები აღდგება ნულამდე. ფერი #FF0000 ღირებულებით არის ყველაზე წითელი შესაძლო წითელი ჩრდილში. იგივე ეხება მწვანეს (#00FF00) და ლურჯს (#0000FF).
- ყვითელი(#FFFF00) მიიღება წითელი და მწვანე შერევით. ეს აშკარად ჩანს ფერის ბორბალზე (ნახ. 6.1), რომელიც წარმოადგენს ძირითად ფერებს (წითელი, მწვანე, ლურჯი) და დამატებითი ან დამატებითი ფერები. მათ შორისაა ყვითელი, ცისფერი და იისფერი (ასევე უწოდებენ მაგენტას). ზოგადად, ნებისმიერი ფერის მიღება შესაძლებელია მასთან ახლოს ფერების შერევით. ამრიგად, ციანი (#00FFFF) მიიღება ლურჯი და მწვანე კომბინაციით.
ბრინჯი. 6.1. ფერადი ბორბალი
თექვსმეტობით მნიშვნელობებზე დაფუძნებული ფერები არ უნდა იყოს ემპირიულად შერჩეული. ამ მიზნით ვარგისია გრაფიკული რედაქტორიშეუძლია სხვადასხვასთან მუშაობა ფერის მოდელები, მაგალითად, Adobe Photoshop. ნახ. ნახაზი 6.2 გვიჩვენებს ამ პროგრამაში ფერის არჩევის ფანჯარას მიმდინარე ფერის თექვსმეტობითი მნიშვნელობა გამოსახულია ხაზით. შეგიძლიათ დააკოპიროთ და ჩასვათ თქვენს კოდში.
ბრინჯი. 6.2. ფანჯარა ფერის არჩევისთვის Photoshop პროგრამა
ვებ ფერები
თუ თქვენ დააყენეთ მონიტორის ფერის გადაცემის ხარისხი 8 ბიტზე (256 ფერი), მაშინ იგივე ფერი შეიძლება იყოს ნაჩვენები სხვადასხვა ბრაუზერებიჩემივე გზით. ეს განპირობებულია გრაფიკის ჩვენებით, როდესაც ბრაუზერი მუშაობს საკუთარი პალიტრით და ვერ აჩვენებს ფერს, რომელიც არ არის მის პალიტრაში. ამ შემთხვევაში ფერს ცვლის სხვა, მასთან ახლოს მყოფი ფერების პიქსელების კომბინაციით, რომლებიც მიბაძავს მოცემულს. იმის უზრუნველსაყოფად, რომ ფერი უცვლელი დარჩეს სხვადასხვა ბრაუზერში, დაინერგა ე.წ. ვებ ფერების პალიტრა. ვებ ფერები არის ის ფერები, რომლებისთვისაც თითოეული კომპონენტი - წითელი, მწვანე და ლურჯი - დაყენებულია ექვსი მნიშვნელობიდან ერთ-ერთზე - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC) , 255 (FF). ამ კომპონენტის თექვსმეტობითი მნიშვნელობა მითითებულია ფრჩხილებში. ფერების საერთო რაოდენობა ყველა შესაძლო კომბინაციიდან იძლევა 6x6x6 - 216 ფერს. ვებ ფერის მაგალითია #33FF66.
ვებ ფერის მთავარი მახასიათებელი ის არის, რომ ის ყველა ბრაუზერში ერთნაირად ჩანს. IN მომენტშივებ ფერების აქტუალობა ძალიან მცირეა მონიტორების ხარისხის გაუმჯობესებისა და მათი შესაძლებლობების გაფართოების გამო.
ფერები სახელით
რიცხვების ნაკრების დამახსოვრების თავიდან ასაცილებლად, შეგიძლიათ გამოიყენოთ ხშირად გამოყენებული ფერების სახელები. მაგიდაზე 6.3 აჩვენებს პოპულარული ფერის სახელების სახელებს.
ფერის სახელი | ფერი | აღწერა | თექვსმეტობითი მნიშვნელობა |
---|---|---|---|
შავი | შავი | #000000 | |
ლურჯი | ლურჯი | #0000FF | |
ფუქსია | ღია იასამნისფერი | #FF00FF | |
ნაცრისფერი | მუქი ნაცრისფერი | #808080 | |
მწვანე | მწვანე | #008000 | |
ცაცხვი | ღია მწვანე | #00FF00 | |
შავგვრემანი | მუქი წითელი | #800000 | |
საზღვაო | მუქი ლურჯი | #000080 | |
ზეთისხილის | ზეთისხილის | #808000 | |
მეწამული | მუქი მეწამული | #800080 | |
წითელი | წითელი | #FF0000 | |
ვერცხლი | ღია ნაცრისფერი | #C0C0C0 | |
ჩაისფერი | ლურჯი-მწვანე | #008080 | |
თეთრი | თეთრი | #FFFFFF | |
ყვითელი | ყვითელი | #FFFF00 |
არ აქვს მნიშვნელობა ფერს მისი სახელით მიუთითებთ თუ თექვსმეტობითი რიცხვების გამოყენებით. ეს მეთოდები თანაბარია მათი ეფექტით. მაგალითი 6.1 გვიჩვენებს, თუ როგორ უნდა დააყენოთ ვებ გვერდის ფონის და ტექსტის ფერები.
მაგალითი 6.1. ფონის და ტექსტის ფერი
ტექსტის მაგალითი
ამ მაგალითში, ფონის ფერი დაყენებულია ტეგის bgcolor ატრიბუტის გამოყენებით
და ტექსტის ფერი ტექსტის ატრიბუტის მეშვეობით. მრავალფეროვნებისთვის, ტექსტის ატრიბუტი დაყენებულია თექვსმეტობით რიცხვზე, ხოლო bgcolor ატრიბუტი დაყენებულია დაჯავშნულ საკვანძო სიტყვაზე teal .Minecraft კოდები ყვავილები, ან Minecraft კოდებიფორმატირება, ნება მიეცით ნებისმიერ მოთამაშეს დაამატოთ ყვავილები და ტექსტის ფორმატირება ყველა შესაძლო გზით პირდაპირ Minecraft-ში. ფერის კოდები &0-9-დან - &a-f-მდე. დაამატეთ ისინი ტექსტის წინ. მოთამაშეების შეტყობინებები შეიძლება შეიცავდეს ფერთა კოდებს, რომლებიც საშუალებას მოგცემთ დაამატოთ ფერი თქვენს წინადადებებში.
ფერები და ფორმატირების კოდები
ამპერსანდის ნიშანი (&), რომელსაც მოჰყვება თექვსმეტობითი რიცხვი შეტყობინებებში, კლიენტს აძლევს სიგნალს, შეცვალოს ფერები ტექსტის ჩვენებისას. გარდა ამისა, ტექსტის ფორმატირება შესაძლებელია ასოებით და შემდეგ ასოებით. შეგიძლიათ დაამატოთ სხვადასხვა ფერები წიგნებს, ბრძანების ბლოკები, სერვერის სახელი, სერვერის აღწერა (motd), სამყაროების სახელებში, ნიშნებში და მოთამაშეთა სახელებშიც კი.
ძალიან მარტივია თქვენი ტექსტის ფორმატირება კონფიგურაციებში ან თამაშში ქვემოთ მოცემული ფერის დიაგრამის გამოყენებით. &r გამოიყენება ყველა კოდის გადასაყენებლად, ე.ი. &mAAA&rBBB გამოჩნდება როგორც AAA BBB.
ჩვენ წარმოგიდგენთ Minecraft-ში არსებული ფერის კოდების ცხრილს თქვენი მოხერხებულობისთვის:
კოდი | სახელი | ტექნიკური დასახელება | სიმბოლო ფერი | სიმბოლო ჩრდილის ფერი | ||||||
---|---|---|---|---|---|---|---|---|---|---|
რ | გ | ბ | Hex | რ | გ | ბ | Hex | |||
&0 | შავი | შავი | 0 | 0 | 0 | 000000 | 0 | 0 | 0 | 000000 |
&1 | მუქი ლურჯი | მუქი_ლურჯი | 0 | 0 | 170 | 0000AA | 0 | 0 | 42 | 00002A |
&2 | მუქი მწვანე | მუქი_მწვანე | 0 | 170 | 0 | 00AA00 | 0 | 42 | 0 | 002A00 |
&3 | მუქი ლურჯი-მწვანე | dark_aqua | 0 | 170 | 170 | 00AAA | 0 | 42 | 42 | 002A2A |
&4 | მუქი წითელი | მუქი_წითელი | 170 | 0 | 0 | AA0000 | 42 | 0 | 0 | 2A0000 |
&5 | მუქი მეწამული | მუქი_იისფერი | 170 | 0 | 170 | AA00AA | 42 | 0 | 42 | 2A002A |
&6 | ოქრო | ოქროს | 255 | 170 | 0 | FFAA00 | 42 | 42 | 0 | 2A2A00 |
&7 | ნაცრისფერი | ნაცრისფერი | 170 | 170 | 170 | AAAAAA | 42 | 42 | 42 | 2A2A2A |
&8 | მუქი ნაცრისფერი | მუქი_ნაცრისფერი | 85 | 85 | 85 | 555555 | 21 | 21 | 21 | 151515 |
&9 | ლურჯი | ლურჯი | 85 | 85 | 255 | 5555FF | 21 | 21 | 63 | 15153F |
&a | მწვანე | მწვანე | 85 | 255 | 85 | 55FF55 | 21 | 63 | 21 | 153F15 |
&ბ | ლურჯი-მწვანე | აკვა | 85 | 255 | 255 | 55FFFF | 21 | 63 | 63 | 153F3F |
და ა.შ | წითელი | წითელი | 255 | 85 | 85 | FF5555 | 63 | 21 | 21 | 3F1515 |
&დ | ღია იასამნისფერი | ღია_იისფერი | 255 | 85 | 255 | FF55FF | 63 | 21 | 63 | 3F153F |
&ე | ყვითელი | ყვითელი | 255 | 255 | 85 | FFFF55 | 63 | 63 | 21 | 3F3F15 |
&f | თეთრი | თეთრი | 255 | 255 | 255 | FFFFFF | 63 | 63 | 63 | 3F3F3F |
ზოგჯერ საჭიროა ხაზი გაუსვით, გადახაზეთ, მონიშნეთნებისმიერი ტექსტი. ეს კეთდება ტექსტის ფორმატირების გამოყენებით. იგი გამოიყენება ზუსტად ისევე, როგორც ფერები (ჩვენ ვდებთ ტექსტის წინ კოდი, მაგალითად &lMinecraft = Minecraft.
თქვენი მოხერხებულობისთვის, ქვემოთ მოცემულია ფორმატირების კოდების ცხრილი:
კოდი | სახელი |
---|---|
&კ | ჯადოსნური ტექსტი |
&ლ | თამამი ტექსტი |
&მ | გადახაზული ტექსტი |
&n | ხაზგასმული ტექსტი |
&o | დახრილი ტექსტი |
&რ | ტექსტი ფორმატირების გარეშე |
თექვსმეტობითი რიცხვები გამოიყენება ფერების დასაზუსტებლად. თექვსმეტობითი სისტემა, განსხვავებით ათობითი სისტემისგან, ეფუძნება, როგორც მისი სახელიდან ჩანს, რიცხვი 16. რიცხვები იქნება შემდეგი: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A. , B, C , D, E, F. რიცხვები 10-დან 15-მდე იცვლება ლათინური ასოებით. თექვსმეტობით სისტემაში 15-ზე მეტი რიცხვები იქმნება ორი რიცხვის ერთში გაერთიანებით. მაგალითად, რიცხვი 255 ათწილადში შეესაბამება რიცხვს FF თექვსმეტობით. რიცხვების სისტემის განსაზღვრისას დაბნეულობის თავიდან ასაცილებლად, ჰეშის სიმბოლო # მოთავსებულია თექვსმეტობით რიცხვამდე, მაგალითად #666999. სამი ფერიდან თითოეულს - წითელ, მწვანე და ლურჯი - შეუძლია მიიღოს მნიშვნელობები 00-დან FF-მდე. ამრიგად, ფერის სიმბოლო დაყოფილია სამ კომპონენტად #rrggbb, სადაც პირველი ორი სიმბოლო მიუთითებს ფერის წითელ კომპონენტზე, შუა ორი - მწვანე, ხოლო ბოლო ორი - ლურჯი. ნებადართულია შემოკლებული ფორმის #rgb გამოყენება, სადაც თითოეული სიმბოლო უნდა გაორმაგდეს. ამრიგად, ჩანაწერი #fe0 უნდა ჩაითვალოს როგორც #ffee00.
სახელით
Internet Explorer | Chrome | ოპერა | Safari | Firefox | Android | iOS |
4.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
ბრაუზერები მხარს უჭერენ ზოგიერთ ფერს მათი სახელით. მაგიდაზე 1 აჩვენებს სახელებს თექვსმეტობითი კოდი, ღირებულებები RGB ფორმატი, HSL და აღწერა.
სახელი | ფერი | კოდი | RGB | HSL | აღწერა |
---|---|---|---|---|---|
თეთრი | #ffffff ან #fff | rgb(255,255,255) | hsl(0.0%,100%) | თეთრი | |
ვერცხლი | #c0c0c0 | rgb(192,192,192) | hsl(0.0%,75%) | ნაცრისფერი | |
ნაცრისფერი | #808080 | rgb(128,128,128) | hsl(0.0%,50%) | მუქი ნაცრისფერი | |
შავი | #000000 ან #000 | rgb(0,0,0) | hsl(0.0%,0%) | შავი | |
შავგვრემანი | #800000 | rgb(128,0,0) | hsl(0.100%,25%) | მუქი წითელი | |
წითელი | #ff0000 ან #f00 | rgb(255,0,0) | hsl(0,100%,50%) | წითელი | |
ფორთოხალი | #ffa500 | rgb(255,165,0) | hsl(38.8,100%,50%) | ნარინჯისფერი | |
ყვითელი | #ffff00 ან #ff0 | rgb(255,255,0) | hsl(60,100%,50%) | ყვითელი | |
ზეთისხილის | #808000 | rgb(128,128,0) | hsl(60,100%,25%) | ზეთისხილის | |
ცაცხვი | #00ff00 ან #0f0 | rgb(0,255,0) | hsl(120,100%,50%) | ღია მწვანე | |
მწვანე | #008000 | rgb(0,128,0) | hsl(120,100%,25%) | მწვანე | |
აკვა | #00ffff ან #0ff | rgb(0,255,255) | hsl(180,100%,50%) | ლურჯი | |
ლურჯი | #0000ff ან #00f | rgb(0,0,255) | hsl(240,100%,50%) | ლურჯი | |
საზღვაო | #000080 | rgb(0,0,128) | hsl(240,100%,25%) | მუქი ლურჯი | |
ჩაისფერი | #008080 | rgb(0,128,128) | hsl(180,100%,25%) | ლურჯი-მწვანე | |
ფუქსია | #ff00ff ან #f0f | rgb(255,0,255) | hsl(300,100%,50%) | ვარდისფერი | |
მეწამული | #800080 | rgb(128,0,128) | hsl(300,100%, 25%) | იისფერი |
RGB-ის გამოყენება
Internet Explorer | Chrome | ოპერა | Safari | Firefox | Android | iOS |
5.0+ | 1.0+ | 3.5+ | 1.3+ | 1.0+ | 1.0+ | 1.0+ |
თქვენ შეგიძლიათ განსაზღვროთ ფერი წითელი, მწვანე და ლურჯი კომპონენტების მნიშვნელობების გამოყენებით ათობითი. სამი ფერის კომპონენტიდან თითოეული იღებს მნიშვნელობას 0-დან 255-მდე. ასევე შესაძლებელია ფერის დაყენება პროცენტულად, 100% შეესაბამება რიცხვს 255. პირველ რიგში, მიუთითეთ საკვანძო სიტყვა rgb , შემდეგ კი ფერის კომპონენტები მითითებულია ფრჩხილებში, გამოყოფილი მძიმეებით, მაგალითად rgb(255, 128, 128) ან rgb(100%, 50%, 50%).
RGBA
Internet Explorer | Chrome | ოპერა | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
RGBA ფორმატი სინტაქსით RGB-ის მსგავსია, მაგრამ მოიცავს ალფა არხს, რომელიც განსაზღვრავს ელემენტის გამჭვირვალობას. მნიშვნელობა 0 არის სრულად გამჭვირვალე, 1 არის გაუმჭვირვალე და შუალედური ღირებულებაისევე როგორც 0.5 - გამჭვირვალობა.
RGBA დაემატა CSS3-ს, ამიტომ CSS კოდი უნდა იყოს დამოწმებული ამ ვერსიის მიხედვით. უნდა აღინიშნოს, რომ CSS3 სტანდარტი ჯერ კიდევ დამუშავების პროცესშია და ზოგიერთი ფუნქცია შეიძლება შეიცვალოს. მაგალითად, ფერი RGB ფორმატში, რომელიც დაემატა ფონის ფერის თვისებას, დამოწმებულია, მაგრამ ფონის თვისებაზე დამატებული ფერი აღარ არის მოქმედი. ამავდროულად, ბრაუზერებს საკმაოდ სწორად ესმით ფერი ორივე თვისებისთვის.
HSL
Internet Explorer | Chrome | ოპერა | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 9.6+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
სახელი HSL ფორმატიწარმოიქმნება პირველი ასოების Hue (hue), Saturate (გაჯერება) და Lightness (სიმსუბუქე) კომბინაციით. Hue არის ფერის მნიშვნელობა ფერის ბორბალზე (ნახ. 1) და მოცემულია გრადუსებში. 0° შეესაბამება წითელს, 120° მწვანეს და 240° ლურჯს. შეფერილობის მნიშვნელობა შეიძლება განსხვავდებოდეს 0-დან 359-მდე.
ბრინჯი. 1. ფერადი ბორბალი
გაჯერება არის ფერის ინტენსივობა და იზომება პროცენტულად 0%-დან 100%-მდე. მნიშვნელობა 0% მიუთითებს ფერის არარსებობაზე და ნაცრისფერი ელფერით, 100% არის გაჯერების მაქსიმალური მნიშვნელობა.
სიმსუბუქე განსაზღვრავს რამდენად კაშკაშა ფერია და მითითებულია პროცენტულად 0%-დან 100%-მდე. დაბალი მნიშვნელობები ფერს უფრო მუქს ხდის, ხოლო მაღალი მნიშვნელობები მას უფრო ნათელს ხდის 0% და 100% შავ-თეთრს.
HSLA
Internet Explorer | Chrome | ოპერა | Safari | Firefox | Android | iOS |
9.0+ | 1.0+ | 10.0+ | 3.1+ | 3.0+ | 2.1+ | 2.0+ |
HSLA ფორმატი სინტაქსით მსგავსია HSL-ს, მაგრამ შეიცავს ალფა არხს ელემენტის გამჭვირვალობის დასაზუსტებლად. მნიშვნელობა 0 არის სრულად გამჭვირვალე, 1 არის გაუმჭვირვალე და შუალედური მნიშვნელობა, როგორიცაა 0.5, არის ნახევრად გამჭვირვალე.
ფერის მნიშვნელობები RGBA ფორმატები, HSL და HSLA დაემატა CSS3-ს, ამიტომ ამ ფორმატების გამოყენებისას შეამოწმეთ თქვენი კოდი ვერსიის მოქმედებისთვის.
HTML5 CSS2.1 CSS3 IE Cr Op Sa Fx
გაფრთხილება
საიტზე ჩამოთვლილი ლომის დაჭერის ყველა მეთოდი თეორიულია და ეფუძნება გამოთვლითი მეთოდები. ავტორები არ იძლევიან გარანტიას თქვენს უსაფრთხოებაზე მათი გამოყენებისას და უარს ამბობენ შედეგებზე პასუხისმგებლობაზე. გახსოვდეთ, ლომი მტაცებელი და საშიში ცხოველია!
ამ მაგალითის შედეგი ნაჩვენებია ნახ. 2.
ბრინჯი. 2. ფერები ვებ გვერდზე
>> ფერების მართვა
თექვსმეტობითი RGB ფერის მნიშვნელობები
ფერის აღწერისა და დამუშავების მეთოდები განსხვავდება ერთმანეთისგან იმით, თუ რა საბოლოო წარმოდგენისთვისაა განკუთვნილი. მოდით შევადაროთ, მაგალითად, ფერების წარმოდგენა ბეჭდვისთვის და კომპიუტერის მონიტორებისთვის. პირველ შემთხვევაში, საფუძველია მიღებული თეთრიქაღალდის ფერი, რომელზეც შემდგომში გამოყენებულია სამი ძირითადი ფერი: ლურჯი, მეწამულიდა ყვითელი. ერთმანეთთან და ქაღალდის თეთრ ფერთან სხვადასხვა პროპორციით შერევით, ეს სამი ძირითადი ფერი იძლევა სხვადასხვა ფერის ჩრდილს, გარდა სუფთა შავისა, ან საღებავების სრული არარსებობის შემთხვევაში, ისინი აძლევენ თეთრ ქაღალდს. თუ მათ შავ ფერს დავუმატებთ, მივიღებთ CMYK-ფერის გადაცემის მეთოდი, როდესაც საჭირო ფერი მიიღება თეთრს დაკარგული ფერების გამოკლებით.
მეორე შემთხვევაში, საფუძველია მიღებული შავიმონიტორის ეკრანის ფერი, რომლის თითოეული უჯრედი ანათებს სამ ფერში: წითელი-წითელი, მწვანე-მწვანე და ლურჯი- ლურჯი. შემდეგ, რაიმე ბზინვის სრული არარსებობის შემთხვევაში, ჩვენ ვიღებთ სუფთა შავი ეკრანის ფერს და ნებისმიერი საჭირო ფერი მოცემულია სამი ფერის თითოეული შეფარდებით. ამ შემთხვევაში მივიღებთ RGB- ფერის გადაცემის მეთოდი. ძირითადი ფერები შეიძლება განსხვავდებოდეს 0
რომ 255
, ან დან 0%
რომ 100%
, ან შეიძლება წარმოდგენილი იყოს როგორც თექვსმეტობითი მნიშვნელობა. ქვემოთ მოცემულ ფიგურაში ხედავთ პირველადი ფერების შერევის შედეგებს.
თექვსმეტობით რიცხვთა სისტემას, ათწილადი რიცხვების სისტემისგან განსხვავებით, აქვს არა ათი ციფრი, არამედ თექვსმეტი - აქედან მოდის სახელი. შესაბამისად, შეიძლება იყოს მხოლოდ ორი ციფრის კომბინაციის არაგანმეორებადი ვარიანტები - 256 , რათა გავაგრძელოთ რიცხვების სერია შემდეგ 9 წერილები არომ ფმაშასადამე, სერია ასე გამოიყურება -
0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. |
ამ შემთხვევაში ფერი მითითებულია სამი თექვსმეტობითი რიცხვები, რომელთაგან თითოეული შედგება ორი ციფრისგან. პირველი რიცხვი განსაზღვრავს ინტენსივობას წითელიფერები, საშუალო - მწვანე, ბოლო - ლურჯიფერები. ყველა რიცხვს შეუძლია მიიღოს მნიშვნელობები დიაპაზონში 00 რომ FF(0-დან 255-მდე). მაგალითად: მწვანე ფერი მოცემულია როგორც #00FF00, წითელი - მსგავსი #FF0000, ლურჯი - მსგავსი #0000FF, თეთრი - მსგავსი #FFFFFF, სრული არარსებობაფერები ან შავი მოცემულია როგორც #000000 .
ქვემოთ მოცემულ ფორმაში შეგიძლიათ მიუთითოთ ნებისმიერი თექვსმეტობითი მნიშვნელობები სამივე ფერისთვის და ნახოთ მათი შერევის შედეგი გამომავალი ველზე დაწკაპუნებით.
ზოგიერთის მაგალითები თექვსმეტობითი მნიშვნელობები RGB ფერები: წითელი, ლურჯი და მწვანე გრადაციები.
ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი |
#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 |
ფერის მითითება სიმებიანი ლიტერალის გამოყენებით
გამოყენების სიმარტივის მიზნით, ზოგიერთ ფერს და მათ კომბინაციებს მიენიჭა სახელები, რომლებიც აღიარებულია ყველა ბრაუზერის მიერ და შესაძლებელი გახდა ბევრი მათგანის დასახელება. ქვემოთ მოყვანილი ცხრილი გვიჩვენებს ზოგიერთი ფერის სახელს:
ხედი | სახელი | ხედი | სახელი | ხედი | სახელი | ხედი | სახელი |
თეთრი | წითელი | ნარინჯისფერი | ყვითელი | ||||
მწვანე | ლურჯი | მეწამული | შავი | ||||
ალისბლუი | ანტიკვარული თეთრი | აკვა | აკვამარინი | ||||
ცისფერი | კრემისფერი | ბისკვიტი | ბლანშედალმონდი | ||||
ლურჯი იისფერი | ყავისფერი | ბურლივუდი | კადეტბლუი | ||||
ჩარტრეუზი | შოკოლადი | მარჯანი | სიმინდისფერი ლურჯი | ||||
სიმინდის აბრეშუმი | ჟოლოსფერი | ციანი | მუქი ლურჯი | ||||
ბნელი | ბნელი ოქროსფერი | მუქი ნაცრისფერი | მუქი მწვანე | ||||
დარხხაკი | Darkmagenta | მუქი მწვანე | მუქი ნარინჯისფერი | ||||
დარკორჩიდი | ჩაბნელებული | მუქი ორაგული | მუქი ზღვისფერი | ||||
მუქი ფირფიტა ლურჯი | მუქი ნაცრისფერი | მუქი ფირუზისფერი | მუქი იისფერი | ||||
ღრმა პინკი | ღრმა ლურჯი | დიმგრეი | Dodgeblue | ||||
ცეცხლგამძლე აგური | ყვავილოვანი თეთრი | ტყის მწვანე | ფუშჩია | ||||
გეინსბორო | აჩრდილი | ოქრო | გოლდენროდი | ||||
რუხი | მწვანე ყვითელი | თაფლისფერი | ცხელი პინკი | ||||
ინდური | ინდიგო | სპილოს ძვლისფერი | ხაკი | ||||
ლავანდა | ლავანდისფერი | ლიმონჩიფონი | ღია ლურჯი | ||||
ლაითკორალი | ლაითციანი | ღია როდი ყვითელი | ღია მწვანე | ||||
ღია ნაცრისფერი | ღია ვარდისფერი | ორაგული | ღია ზღვისფერი | ||||
ღია ცისფერი | ნაცრისფერი ნაცრისფერი | ღია ცისფერი | ღია ყვითელი | ||||
ცაცხვი | ცაცხვისფერი | თეთრეული | მაგენტა | ||||
მარუნი | საშუალო აქვამარინი | საშუალო ლურჯი | საშუალო ორქიდეა | ||||
საშუალო მეწამული | საშუალო ზღვის მწვანე | საშუალო ფირფიტა ლურჯი | საშუალო გაზაფხულის მწვანე | ||||
საშუალო ფირუზისფერი | საშუალო იისფერი | შუაღამის ლურჯი | პიტნის კრემი | ||||
მისტიროზა | ნავახო თეთრი | საზღვაო ძალები | ოლდლეისი | ||||
ზეთისხილის | ოლივერაბი | ნარინჯისფერი | ორქიდეა | ||||
პალეგოლდენროდი | პალეგრინი | პალიტრა ფირუზი | პალეიისფერი | ||||
პაპაიაჰაპი | ატამი | პერუს | ვარდისფერი | ||||
ქლიავი | ფხვნილი ლურჯი | როზიბრაუნი | სამეფო ლურჯი | ||||
უნაგირისფერი | ზღვის მწვანე | ზღვის ნაჭუჭი | სიენა | ||||
ვერცხლი | ცისფერი | ფიქალისფერი | სლატეგრეი | ||||
თოვლი | Springgreen | ფოლადის ლურჯი | თან | ||||
ჩაისფერი | ეკალი | პომიდორი | ფირუზისფერი | ||||
იისფერი | ხორბალი | Whitesmoke | ყვითელი მწვანე |
უსაფრთხო ფერის პალიტრის გამოყენება
სამწუხაროდ, on სხვადასხვა პლატფორმები, სხვადასხვა სისტემის პარამეტრებთან ერთად, სწორი ფერის გადმოცემა არის პრობლემა. საქმე ის არის, რომ ბრაუზერი ყოველთვის ცდილობს მორგებას ფერის პალიტრადოკუმენტის ქვეშ სისტემის პარამეტრებიდა მონიტორის შესაძლებლობები ფერების დამოუკიდებლად შერევით და მათი ჩანაცვლებით. შედეგად, ზოგჯერ მომხმარებელი ვერ ხედავს ზუსტად იმას, რისი ჩვენებაც სურდა ვებმასტერს. ამ სიტუაციიდან გამოსავალი იქნა ნაპოვნი პალიტრის გამოყენებაში, რომლის თითოეული ფერი გარანტირებულია თანაბრად გამოსახული ყველა ბრაუზერის მიერ სხვადასხვა პლატფორმაზე. ეს არის ე.წ გარანტირებულიპალიტრა, ასევე ე.წ უსაფრთხოპალიტრა. ეს პალიტრა მოიცავს ფერებს, რომელთა ფერის კომპონენტები იღებენ შემდეგ მნიშვნელობებს: 00 ,33 ,66 ,99 , CC,FF, ყველა შესაძლო გზით 216 მათი კომბინაციები.
ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი | ხედი | კოდი |
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 |