Sunrise Computer Classes: How to Add Color in CSS

How to Add Color in CSS (In Hindi)

CSS में Color Declare करने के लिए Color Property का इस्तेमाल किया जाता हैं. CSS द्वारा आप Foreground और Background दोनों के लिए Color Declare कर सकते हैं.

Foreground Color से हमारा मतलब Font Color, Border Color, Outlines, Text Color आदि Elements की Color Settings से हैं. आप आसानी से किसी भी HTML Element के लिए Color Declare कर सकते हैं.

CSS Color Add करने की विभिन्न विधियाँ

Color Declare करने के बहुत तरीके हैं. लेकिन, सभी तरीके सभी Browsers द्वारा Support नही किए जाते हैं. इसलिए हम यहाँ तीन प्रचलित तरीकों के बारे में बता रहे हैं. ये तरीके सभी ब्राउजरों द्वारा Support किए जाते हैं.

CSS Color Add करने के तीन प्रचलित तरीके:

Hex Value
RGB Value
Color Name

Hex Value द्वारा Color Add करना

Hex का मतलब होता हैं Hexadecimal. Hexadecimal Code एक 6 अंकों का कोड होता हैं. जिसमें क्रमश: Red, Green और Blue Colors की Hex Value होती हैं. पहले दो अंक Red, मध्य के दो अंक Green और अंतिम दो अंक Blue को Represent करते हैं.

Hexadecimal Value Alphanumeric होती हैं. जिसमें Alphabets और Numbers दोनों शामिल होते हैं. आप Hex Value को Lowercase या Uppercase दोनों में से किसी भी प्रकार में लिख सकते हैं. चुंकि Lowercase लिखने में आसान होता हैं और Uppercase पढने में आसान रहता हैं. पसंद आपको करनी हैं.

p {
color: #000000;
}
h1 {
color:#000;
}

ऊपर हमने Paragraph Element की Color को Black Set किया हैं. जिसकी Hex Value #000000 होती हैं. और Heading Element का Color भी Black Declare किया हैं. लेकिन, आप देख रहे कि इसमे सिर्फ 3 Hex Value ही लिखि हुई हैं. इसे Short Hex Value कहते हैं. इसे भी ब्राउजर #000000 की तरह ही समझता हैं. आप भी इसी तरह किसी भी Element के लिए Color Declare कर सकते हैं.

RGB Value द्वारा Color Add करना

RGB तीन शब्दों से बना हैं. जिसमें R का मतलब Red, G का मतलब Green और B का मतलब Blue होता हैं. RGB द्वारा Colors की RGB Value को लिखा जाता हैं. आप RGB Value को प्रतिशत में भी Declare कर सकते हैं.

RGB द्वारा 0 से 255 के बीच में किसी Color की Intensity दर्शायी जाती हैं. आप जितनी ज्यादा Value किसी Color की Declare करेंगे वह Color उतना ही ज्यादा Color में दिखाई देंगा.

p {
color: rgb(255,0,0);
}

ऊपर हमने Paragraph Element का Color Red Declare किया हैं. जिसमें Red की Intensity Full यानि 255 हैं, और बाकि Colors की Intensity शून्य हैं. आप इसी Mix करके अपने लिए मनचाहा कलर बना सकते हैं.

Hex और RGB Color Code कहाँ से प्राप्त करें?

ये प्रशन आना स्वाभाविक हैं कि हम Hex Value और RGB Value कैसे बनाये? या कहीं से बनी बनाई मिल सकती हैं?

आप Colors की Hex Value और RGB Value बहुत सारे ऑनलाईन Color Mixers के द्वारा बना सकते हैं. आपको Color Mixer Tool मुफ्त में मिल जाएंगे. जाएंगे से आप अपने लिए मन पसंद कलर बना सकते हैं.

अगर आप Online Color Mixers का इस्तेमाल करना नहीं चाहते हैं. तो आप कुछ Graphics Tools जैसे Adobe Photoshop, MS Paint के Color Tool द्वारा ये Value बना सकते हैं.

Color Name

आप Color Value को Color Name से भी Declare कर सकते हैं. जो सबसे आसान तरीका हैं. लेकिन, आप सभी Colors को उनके नाम से Declare नहीं कर सकते हैं. और ना ही ऐसा करना संभव हैं.

Color को उनके नाम से Declare करना सरल तो हैं, मगर Color Name को सभी ब्राउजर Support नहीं करते हैं. इसलिए इस विधि को ज्यादा इस्तेमाल नहीं किया जाता हैं.

इसका एक कारण ये भी हैं हम इंसान Colors के नाम भी याद नहीं रख सकते हैं. और सभी Colors को नाम भी नही दिया जा सकता हैं. क्योंकि Colors की संभावित संख्या 255x255x255 के बराबर होती हैं.

W3C – World Wide Web Consortium द्वारा लगभग 140 Colors को Standard Color माना गया हैं. इनकी संख्या में लगातार इजाफा भी हो रहा हैं. इन Colors को सभी ब्राउजरों द्वारा Support किया जाता हैं. इन सभी Standard Colors का नाम उनके Hex Value के साथ नीचे दिया जा रहा हैं.