HTML RGB Colors

तीन Light Channels

rgb(red, green, blue) 0 से 255 तक के तीन numbers लेता है जो screen पर मिलाई गई red, green, और blue light की intensity को represent करते हैं।

ज़्यादा numbers का मतलब है उस channel के लिए तेज़ light, इसलिए rgb(255, 0, 0) पूरी intensity पर शुद्ध red है जबकि बाकी दोनों channels पूरी तरह बंद हैं।

उदाहरण: The Three Light Channels

<p style="color: rgb(255, 0, 0);">Pure red text</p>

Custom Colors के लिए Channels मिलाना

तीनों channels में अलग-अलग intensities मिलाने से custom colors बनते हैं -- rgb(255, 165, 0) पूरे red को medium green और शून्य blue के साथ मिलाकर orange बनाता है।

140 named CSS color keywords से कहीं आगे, इस तरह लाखों अलग-अलग colors तक पहुंचा जा सकता है।

उदाहरण: Mixing Channels for Custom Colors

<p style="color: rgb(255, 165, 0);">Orange text</p>

Gray के Shades

तीनों channels को बिल्कुल एक जैसी value पर सेट करने से gray का एक shade बनता है -- rgb(0, 0, 0) black है, rgb(255, 255, 255) white है, और इनके बीच कोई भी equal value, जैसे rgb(128, 128, 128), एक mid-tone gray है।

यह RGB को एक consistent grayscale palette बनाने का आसान तरीका बनाता है।

उदाहरण: Shades of Gray

<p style="color: rgb(128, 128, 128);">Mid-tone gray text</p>

rgba() से Transparency जोड़ना

rgba(red, green, blue, alpha) एक चौथी value जोड़ता है जिसे alpha कहते हैं, जो 0 (पूरी तरह transparent, invisible) से 1 (पूरी तरह opaque, solid) तक होती है, जिससे कोई color उसके पीछे मौजूद content के साथ blend हो सके।

यह आमतौर पर images या अन्य page content के ऊपर semi-transparent overlays के लिए उपयोग किया जाता है।

उदाहरण: Adding Transparency with rgba()

<div style="background-color: rgba(0, 0, 0, 0.5);">Semi-transparent overlay</div>

Inline Styles और CSS Rules में RGB

RGB और RGBA values चाहे HTML inline style attribute में उपयोग हों या external CSS stylesheet के अंदर, बिल्कुल एक जैसा काम करती हैं, और color, background-color, border-color, और box-shadow सहित किसी भी color स्वीकार करने वाली property पर apply की जा सकती हैं।

उदाहरण: RGB in Inline Styles and CSS Rules

<style>
  .box { border-color: rgb(0, 128, 255); }
</style>
<div class="box" style="color: rgb(200, 0, 0);">Styled with RGB</div>