RGB: स्क्रीन रंग कैसे बनाती है
हमारी आँख में तीन तरह के रंग-सेंसर होते हैं: लाल, हरी और नीली रोशनी के लिए। स्क्रीन यही नक़ल करती है। हर छोटे बिंदु (पिक्सेल) में तीन छोटी बत्तियाँ होती हैं: R, G और B। हर बत्ती को तेज़ या धीमा करके पिक्सेल कोई भी रंग दिखा लेता है।
- लाल + हरा = पीला
- हरा + नीला = सियान
- लाल + नीला = मैजेंटा
- लाल + हरा + नीला (तीनों पूरे) = सफ़ेद
- सब बंद = काला
इसे योगात्मक मिश्रण (additive mixing) कहते हैं, क्योंकि रोशनी जोड़ने से रंग और चमकीला होता है।
रंग की संख्याएँ: 0 से 255, बाइट और हेक्स कोड
R, G और B में से हर एक को 1 बाइट (8 बिट) मिलता है। एक बाइट में 0 से 255 तक आ सकता है। इसलिए एक पिक्सेल को 3 बाइट = 24 बिट चाहिए। इसे 24-बिट रंग (ट्रू कलर) कहते हैं।
रंगों की संख्या = 256 × 256 × 256 = 16 777 216।
वेब पेज तीनों संख्याएँ हेक्साडेसिमल (आधार 16) में लिखते हैं, हर एक के दो अंक: #RRGGBB। जैसे 255 = FF, 128 = 80, 0 = 00। इसलिए (255, 128, 0) = #FF8000 (नारंगी)। तीनों संख्याएँ बराबर हों तो स्लेटी रंग बनता है: (100, 100, 100)।
CMYK: प्रिंटर रंग कैसे बनाते हैं
काग़ज़ अपनी रोशनी नहीं बनाता। वह सिर्फ़ लौटाता है। स्याही रोशनी के कुछ रंगों को सोख लेती है। इसलिए प्रिंटर व्यवकलनात्मक मिश्रण (subtractive mixing) में चार स्याहियाँ लेते हैं: C सियान, M मैजेंटा, Y पीला और K की (काला)।
- सियान + पीला = हरा
- मैजेंटा + पीला = लाल
- सियान + मैजेंटा = नीला
- तीनों साथ = गंदा गहरा भूरा, इसलिए साफ़ अक्षरों और गहरे काले के लिए अलग काली स्याही (K) लेते हैं।
मात्रा प्रतिशत में लिखते हैं। नारंगी (255, 128, 0) लगभग C 0%, M 50%, Y 100%, K 0% है। स्क्रीन के कुछ बहुत चमकीले रंग ठीक वैसे छप नहीं सकते। इसीलिए छपा चित्र थोड़ा फीका लग सकता है।
HSL: रंग को वैसे बताना जैसे हम सोचते हैं
HSL रंग को तीन आसान संख्याएँ देता है:
- ह्यू (H): रंग-चक्र पर जगह, 0° से 360°। 0° लाल, 60° पीला, 120° हरा, 180° सियान, 240° नीला, 300° मैजेंटा।
- सैचुरेशन (S): रंग कितना शुद्ध है। 100% चटक, 0% स्लेटी।
- लाइटनेस (L): कितना चमकीला। 0% काला, 50% सामान्य रंग, 100% सफ़ेद।
कलाकारों को HSL पसंद है, क्योंकि "थोड़ा हल्का कर दो" का मतलब बस L बदलना है। नारंगी (255, 128, 0) है H 30°, S 100%, L 50%।
रैस्टर और वेक्टर चित्र
रैस्टर (बिटमैप) चित्र पिक्सेल का जाल है, हर पिक्सेल का अपना रंग-कोड। फ़ोटो रैस्टर होती हैं। फ़ाइल साइज़ = चौड़ाई × ऊँचाई × प्रति पिक्सेल बिट। बड़ा करो तो चौकोर दाने दिखते हैं, क्योंकि पिक्सेल से ज़्यादा बारीकी है ही नहीं।
वेक्टर चित्र संख्याओं से आकृतियाँ रखता है: केंद्र, त्रिज्या और रंग वाला वृत्त; दो सिरों वाली रेखा। कंप्यूटर आकृति को हर साइज़ पर नए सिरे से बनाता है, इसलिए वह कभी दानेदार नहीं होती। फ़ाइल अक्सर छोटी होती है।
| रैस्टर | वेक्टर | |
|---|---|---|
| क्या रखता है | पिक्सेल | आकृतियाँ |
| बड़ा करने पर | दानेदार | साफ़ |
| किसके लिए अच्छा | फ़ोटो | लोगो, नक़्शे, रेखाचित्र |
| उदाहरण | JPG, PNG | SVG |
सैंपलिंग: ध्वनि को संख्याओं में बदलना
असली ध्वनि हवा में एक चिकनी तरंग है। कंप्यूटर सिर्फ़ संख्याएँ रख सकता है। इसलिए वह सैंपलिंग करता है: हर सेकंड कई बार तरंग की ऊँचाई नापकर वह संख्या रख लेता है।
- सैंपल रेट: प्रति सेकंड माप, हर्ट्ज़ (Hz) में। म्यूज़िक सीडी में 44 100 Hz होता है।
- बिट डेप्थ: हर माप के लिए बिट। 16 बिट से 65 536 ऊँचाई-स्तर मिलते हैं।
- चैनल: मोनो = 1, स्टीरियो = 2।
ज़्यादा सैंपल और ज़्यादा बिट तरंग की बेहतर नक़ल करते हैं, पर फ़ाइल बड़ी हो जाती है। 44 100 Hz काफ़ी है, क्योंकि इंसान लगभग 20 000 Hz तक सुनता है, और नक़ल ठीक से करने के लिए सबसे ऊँची आवाज़ की आवृत्ति के दुगुने से थोड़े ज़्यादा माप प्रति सेकंड चाहिए।
साइज़ (बिट) = सैंपल रेट × बिट डेप्थ × सेकंड × चैनल।
खुद करके देखो
3D में: आख़िरी चरण में शुद्ध पीला (255, 255, 0) बनाओ, फिर स्लेटी (तीनों बराबर)। सैंपलिंग वाले चरण में सैंपल ऊपर-नीचे करो और देखो कि नारंगी रेखा नीली तरंग के क़रीब कैसे आती है।
घर पर: किसी ड्रॉइंग ऐप या वेब पेज का कलर पिकर खोलो। #FF0000, #00FF00, #0000FF और फिर #808080 लिखो। एंटर दबाने से पहले हर रंग का अंदाज़ा लगाओ।
मुख्य सूत्र और परिभाषाएँ
- रंग = 256 × 256 × 256 = 16 777 216 (24-बिट)
- पिक्सेल का साइज़ = 3 बाइट (24-बिट रंग)
- रैस्टर साइज़ (बिट) = चौड़ाई × ऊँचाई × प्रति पिक्सेल बिट
- ध्वनि साइज़ (बिट) = सैंपल रेट × बिट डेप्थ × सेकंड × चैनल
- CMYK: K = 1 − max(R,G,B)/255 (फिर बचे हुए से C, M, Y)
- हेक्स #RRGGBB: हर चैनल के दो हेक्स अंक, 00 से FF
हल किए गए उदाहरण
1. लाल (255, 0, 0) को हेक्स कोड में लिखो।
255 = FF, 0 = 00, 0 = 00। इसलिए लाल = #FF0000।
2. 24-बिट रंग वाले 200 × 100 के चित्र को कितने बाइट चाहिए?
पिक्सेल = 200 × 100 = 20 000। हर पिक्सेल = 3 बाइट। 20 000 × 3 = 60 000 बाइट = 60 kB।
3. नारंगी (255, 128, 0) को CMYK प्रतिशत में बदलो।
K = 1 − 255/255 = 0। C = 1 − 255/255 = 0%। M = 1 − 128/255 = लगभग 50%। Y = 1 − 0 = 100%। CMYK = (0, 50, 100, 0)।
4. नारंगी (255, 128, 0) का HSL निकालो।
लाल सबसे बड़ा और नीला सबसे छोटा है, इसलिए ह्यू लाल (0°) और पीले (60°) के बीच है। हरा आधा चढ़ा है, इसलिए H लगभग 30°। रंग शुद्ध है (S = 100%) और L = (अधिकतम + न्यूनतम) ÷ 2 = (255 + 0) ÷ 2 ÷ 255 = 50%। HSL = (30°, 100%, 50%)।
5. मोनो ध्वनि 44 100 Hz, 16 बिट, 10 सेकंड। साइज़ कितना?
44 100 × 16 × 10 = 7 056 000 बिट। ÷ 8 = 882 000 बाइट = 882 kB।
6. स्कूल को पेन और बड़े फ़्लेक्स बैनर दोनों के लिए एक लोगो चाहिए। कौन-सा चित्र प्रकार रखे?
वेक्टर फ़ाइल। वह हर साइज़ पर साफ़ रहती है और फ़ाइल छोटी होती है। रैस्टर लोगो बड़े बैनर पर दानेदार दिखता।
आम गलतियाँ
- सोचना कि लाल, हरी, नीली रोशनी मिलकर काला देती है। रोशनी में सफ़ेद बनता है; स्याही में लगभग काला।
- प्रिंटर के लिए बिना सोचे RGB मान लेना: छपाई में CMYK चलता है, इसलिए चमकीले स्क्रीन-रंग फीके दिख सकते हैं।
- पिक्सेल और बाइट गड़बड़ाना: 24-बिट रंग में एक पिक्सेल 3 बाइट का है, 1 का नहीं।
- मान लेना कि वेक्टर चित्र में पिक्सेल होते हैं। वह आकृतियाँ रखता है; पिक्सेल तभी बनते हैं जब वह स्क्रीन पर दिखाया जाता है।