रंग ट्यूटोरियल

लाल, हरे और नीले प्रकाश को मिलाकर रंग प्रदर्शित किए जाते हैं।


रंग नाम

CSS के साथ, रंग नामों का उपयोग करके रंगों को सेट किया जा सकता है:

उदाहरण

Color Name
 Red
 Yellow
 Cyan
 Blue
 Magenta

सीएसएस रंग मान

CSS के साथ, रंगों को विभिन्न तरीकों से निर्दिष्ट किया जा सकता है:

  • रंग नामों से
  • आरजीबी मूल्यों के रूप में
  • हेक्साडेसिमल मानों के रूप में
  • HSL मान (CSS3) के रूप में
  • HWB मान (CSS4) के रूप में
  • currentcolorकीवर्ड के साथ

आरजीबी रंग

आरजीबी रंग मान सभी ब्राउज़रों में समर्थित हैं।

एक आरजीबी रंग मान निर्दिष्ट किया गया है: आरजीबी ( लाल , हरा , नीला )।

प्रत्येक पैरामीटर रंग की तीव्रता को 0 और 255 के बीच एक पूर्णांक के रूप में परिभाषित करता है।

उदाहरण के लिए, rgb(0,0,255) को नीले रंग के रूप में प्रस्तुत किया जाता है, क्योंकि नीला पैरामीटर इसके उच्चतम मान (255) पर सेट होता है और अन्य 0 पर सेट होते हैं।

उदाहरण

Color RGB Color
  rgb(255,0,0) Red
  rgb(0,255,0) Green
  rgb(0,0,255) Blue

ग्रे के रंगों को अक्सर सभी 3 प्रकाश स्रोतों के लिए समान मानों का उपयोग करके परिभाषित किया जाता है:

उदाहरण

Color RGB Color
  rgb(0,0,0) Black
  rgb(128,128,128) Gray
  rgb(255,255,255) White


हेक्साडेसिमल रंग

हेक्साडेसिमल रंग मान भी सभी ब्राउज़रों में समर्थित हैं।

एक हेक्साडेसिमल रंग के साथ निर्दिष्ट किया गया है: # RR GG BB

RR (लाल), GG (हरा) और BB (नीला) 00 और FF के बीच हेक्साडेसिमल पूर्णांक हैं जो रंग की तीव्रता को निर्दिष्ट करते हैं।

उदाहरण के लिए, #0000FF नीले रंग के रूप में प्रदर्शित होता है, क्योंकि नीला घटक अपने उच्चतम मान (FF) पर सेट होता है और अन्य 00 पर सेट होते हैं।

उदाहरण

Color HEX RGB Color
  #FF0000 rgb(255,0,0) Red
  #00FF00 rgb(0,255,0) Green
  #0000FF rgb(0,0,255) Blue

ग्रे के रंगों को अक्सर सभी 3 प्रकाश स्रोतों के लिए समान मानों का उपयोग करके परिभाषित किया जाता है:

उदाहरण

Color HEX RGB Color
  #000000 rgb(0,0,0) Black
  #808080 rgb(128,128,128) Gray
  #FFFFFF rgb(255,255,255) White

अपर केस या लोअर केस?

आप हेक्साडेसिमल मान निर्दिष्ट करने के लिए अपर केस या लोअर केस अक्षरों का उपयोग कर सकते हैं।

लोअर केस लिखना आसान है। ऊपरी मामले को पढ़ना आसान है।


रंग नाम

CSS 140 मानक रंग नामों का समर्थन करता है।

अगले अध्याय में आपको हेक्साडेसिमल मानों के साथ रंगों के नामों की पूरी वर्णमाला सूची मिलेगी:

Color Name Hex Color
AliceBlue #F0F8FF  
AntiqueWhite #FAEBD7  
Aqua #00FFFF  
Aquamarine #7FFFD4  
Azure #F0FFFF  
Beige #F5F5DC  
Bisque #FFE4C4  

वर्तमान रंग कीवर्ड

कीवर्ड किसी तत्व की currentcolorरंग संपत्ति के मूल्य को संदर्भित करता है।

उदाहरण

निम्नलिखित <div> तत्व का बॉर्डर रंग नीला होगा, क्योंकि <div> तत्व का टेक्स्ट रंग नीला है:

#myDIV {
  color: blue; /* Blue text color */
  border: 10px solid currentcolor; /* Blue border color */
}