पिरोजा रंग कोड html. HTML ट्यूटोरियल. RGB रंग. सुरक्षित पॅलेट रंग

CSS मधील कलर कोड रंग निर्दिष्ट करण्यासाठी वापरले जातात. सामान्यतः, रंग कोड किंवा रंग मूल्ये एकतर घटकाच्या अग्रभागी रंग (उदा. मजकूर रंग, दुव्याचा रंग) किंवा घटकाचा पार्श्वभूमी रंग (पार्श्वभूमी रंग, ब्लॉक रंग) साठी रंग सेट करण्यासाठी वापरली जातात. ते बटण, बॉर्डर, मार्कर, होव्हर आणि इतर सजावटीच्या प्रभावांचा रंग बदलण्यासाठी देखील वापरला जाऊ शकतो.

तुम्ही तुमची कलर व्हॅल्यू विविध फॉरमॅटमध्ये निर्दिष्ट करू शकता. खालील सारणी सर्व संभाव्य स्वरूपांची यादी करते:

सूचीबद्ध स्वरूपांचे खाली अधिक तपशीलवार वर्णन केले आहे.

CSS रंग - हेक्स कोड

हेक्साडेसिमल रंग कोडरंगाचे सहा-अंकी प्रतिनिधित्व आहे. पहिले दोन अंक (RR) लाल मूल्याचे प्रतिनिधित्व करतात, पुढील दोन हिरव्या मूल्याचे (GG) प्रतिनिधित्व करतात आणि शेवटचे दोन निळे मूल्य (BB) दर्शवतात.

CSS रंग - लहान हेक्स कोड

लहान हेक्स रंग कोडसहा-वर्णांच्या नोटेशनचा एक लहान प्रकार आहे. या स्वरूपात, सहा-अंकी रंग मूल्य तयार करण्यासाठी प्रत्येक अंकाची पुनरावृत्ती केली जाते. उदाहरणार्थ: #0F0 #00FF00 होतो.

हेक्साडेसिमल मूल्य कोणत्याही ग्राफिक्स सॉफ्टवेअर जसे की Adobe Photoshop, Core Draw इत्यादींमधून घेतले जाऊ शकते.

CSS मधील प्रत्येक हेक्साडेसिमल कलर कोडच्या आधी हॅश चिन्ह "#" असेल. खाली हेक्साडेसिमल नोटेशन्स वापरण्याची उदाहरणे आहेत.

CSS रंग - RGB मूल्ये

RGB मूल्य rgb() गुणधर्म वापरून सेट केलेला रंग कोड आहे. या गुणधर्माला तीन मूल्ये लागतात: लाल, हिरवा आणि निळा प्रत्येकी एक. मूल्य पूर्णांक असू शकते, 0 ते 255 पर्यंत, किंवा टक्केवारी.

टीप:सर्व ब्राउझर rgb() रंग गुणधर्मास समर्थन देत नाहीत, म्हणून ते वापरण्याची शिफारस केलेली नाही.

खाली RGB मूल्ये वापरून अनेक रंग दर्शविणारे एक उदाहरण आहे.

रंग कोड जनरेटर

आमची सेवा वापरून तुम्ही लाखो रंग कोड तयार करू शकता.

ब्राउझर सुरक्षित रंग

खाली 216 रंगांची सारणी आहे जी सर्वात सुरक्षित आणि सर्वात संगणक-स्वतंत्र आहेत. CSS मधील हे रंग 000000 पासून FFFFFF हेक्साडेसिमल कोड पर्यंत आहेत. ते वापरण्यास सुरक्षित आहेत कारण 256 रंग पॅलेटसह कार्य करताना सर्व संगणक योग्यरित्या रंग प्रदर्शित करतात याची ते खात्री करतात.

HEX/HTML

HEX रंग काहीही नसून RGB चे हेक्साडेसिमल प्रतिनिधित्व आहे.

रंग हेक्साडेसिमल अंकांचे तीन गट म्हणून दर्शविले जातात, जेथे प्रत्येक गट स्वतःच्या रंगासाठी जबाबदार असतो: #112233, जेथे 11 लाल, 22 हिरवा, 33 निळा आहे. सर्व मूल्ये 00 आणि FF च्या दरम्यान असणे आवश्यक आहे.

अनेक ऍप्लिकेशन्स हेक्साडेसिमल कलर नोटेशनच्या शॉर्ट फॉर्मला अनुमती देतात. जर तीन गटांपैकी प्रत्येकामध्ये समान वर्ण असतील, उदाहरणार्थ #112233, तर ते #123 असे लिहिले जाऊ शकतात.

1. h1 (रंग: #ff0000;) /* लाल */
2. h2 (रंग: #00ff00;) /* हिरवा */
3. h3 (रंग: #0000ff;) /* निळा */
4. h4 ( रंग: #00f; ) /* समान निळा, लघुलेख */

RGB

RGB (लाल, हिरवा, निळा) कलर स्पेसमध्ये लाल, हिरवा आणि निळा मिसळून तयार करता येणारे सर्व संभाव्य रंग असतात. हे मॉडेल फोटोग्राफी, दूरदर्शन आणि संगणक ग्राफिक्समध्ये लोकप्रिय आहे.

RGB मूल्ये 0 ते 255 पर्यंत पूर्णांक म्हणून निर्दिष्ट केली आहेत. उदाहरणार्थ, rgb(0,0,255) निळ्या रंगात प्रदर्शित केले जाते कारण निळा पॅरामीटर त्याच्या सर्वोच्च मूल्यावर (255) सेट केला आहे आणि इतर 0 वर सेट केले आहेत.

काही ऍप्लिकेशन्स (विशेषत: वेब ब्राउझर) RGB मूल्यांच्या टक्केवारी रेकॉर्डिंगला समर्थन देतात (0% ते 100% पर्यंत).

1. h1 ( रंग: rgb(255, 0, 0); ) /* लाल */
2. h2 ( रंग: rgb(0, 255, 0); ) /* हिरवा */
3. h3 ( रंग: rgb(0, 0, 255); ) /* निळा */
4. h4 ( रंग: rgb(0%, 0%, 100%); ) /* समान निळा, टक्केवारी नोंद */

RGB रंग मूल्ये सर्व प्रमुख ब्राउझरमध्ये समर्थित आहेत.

RGBA

अलीकडे, आधुनिक ब्राउझरने आरजीबीए कलर मॉडेलसह कार्य करणे शिकले आहे - अल्फा चॅनेलच्या समर्थनासह आरजीबीचा विस्तार, जो ऑब्जेक्टची अस्पष्टता निर्धारित करतो.

RGBA रंग मूल्य असे नमूद केले आहे: rgba(लाल, हिरवा, निळा, अल्फा). अल्फा पॅरामीटर ०.० (पूर्ण पारदर्शक) ते १.० (पूर्ण अपारदर्शक) पर्यंतची संख्या आहे.

1. h1 ( रंग: rgb(0, 0, 255); ) /* नियमित RGB मध्ये निळा */
2. h2 ( रंग: rgba(0, 0, 255, 1); ) /* RGBA मध्ये समान निळा, कारण अपारदर्शकता: 100% */
3. h3 ( रंग: rgba(0, 0, 255, 0.5); ) /* अपारदर्शकता: 50% */
4. h4 ( रंग: rgba(0, 0, 255, .155); ) /* अपारदर्शकता: 15.5% */
5. h5 ( रंग: rgba(0, 0, 255, 0); ) /* पूर्णपणे पारदर्शक */

RGBA IE9+, Firefox 3+, Chrome, Safari आणि Opera 10+ मध्ये समर्थित आहे.

एचएसएल

HSL कलर मॉडेल हे बेलनाकार समन्वय प्रणालीमध्ये RGB मॉडेलचे प्रतिनिधित्व आहे. HSL सामान्य RGB पेक्षा अधिक अंतर्ज्ञानी आणि मानवी वाचनीय मार्गाने रंगांचे प्रतिनिधित्व करते. मॉडेलचा वापर अनेकदा ग्राफिक्स ऍप्लिकेशन्स, कलर पॅलेट आणि इमेज ॲनालिसिसमध्ये केला जातो.

HSL चा अर्थ ह्यू (रंग/रंग), संपृक्तता (संपृक्तता), लाइटनेस/ल्युमिनन्स (लाइटनेस/लाइटनेस/ल्युमिनोसिटी, ब्राइटनेसमध्ये गोंधळ होऊ नये).

ह्यू कलर व्हीलवरील रंगाचे स्थान निर्दिष्ट करते (0 ते 360 पर्यंत). संपृक्तता हे संपृक्ततेचे टक्केवारी मूल्य आहे (0% ते 100% पर्यंत). लाइटनेस ही हलकीपणाची टक्केवारी आहे (0% ते 100% पर्यंत).

1. h1 ( रंग: hsl(120, 100%, 50%); ) /* हिरवा */
2. h2 ( रंग: hsl(120, 100%, 75%); ) /* हलका हिरवा */
3. h3 ( रंग: hsl(120, 100%, 25%); ) /* गडद हिरवा */
4. h4 ( रंग: hsl(120, 60%, 70%); ) /* पेस्टल हिरवा */

HSL IE9+, Firefox, Chrome, Safari आणि Opera 10+ मध्ये समर्थित आहे.

HSLA

RGB/RGBA प्रमाणेच, HSL मध्ये ऑब्जेक्टची अपारदर्शकता दर्शवण्यासाठी अल्फा चॅनल सपोर्टसह HSLA मोड आहे.

HSLA रंग मूल्य असे निर्दिष्ट केले आहे: hsla(रंग, संपृक्तता, हलकीपणा, अल्फा). अल्फा पॅरामीटर ०.० (पूर्ण पारदर्शक) ते १.० (पूर्ण अपारदर्शक) पर्यंतची संख्या आहे.

1. h1 ( रंग: hsl(120, 100%, 50%); ) /* सामान्य HSL मध्ये हिरवा */
2. h2 ( रंग: hsla(120, 100%, 50%, 1); ) /* HSLA मध्ये समान हिरवा, कारण अपारदर्शकता: 100% */
3. h3 ( रंग: hsla(120, 100%, 50%, 0.5); ) /* अपारदर्शकता: 50% */
4. h4 ( रंग: hsla(120, 100%, 50%, .155); ) /* अपारदर्शकता: 15.5% */
5. h5 ( रंग: hsla(120, 100%, 50%, 0); ) /* पूर्णपणे पारदर्शक */

CMYK

CMYK कलर मॉडेल बहुधा कलर प्रिंटिंग आणि प्रिंटिंगशी संबंधित असते. CMYK (RGB च्या विपरीत) एक वजाबाकी मॉडेल आहे, याचा अर्थ उच्च मूल्ये गडद रंगांशी संबंधित आहेत.

रंग निळसर (निळसर), किरमिजी (किरमिजी), पिवळा (पिवळा), काळा (की/काळा) च्या गुणोत्तराने निर्धारित केला जातो.

CMYK मध्ये रंग परिभाषित करणाऱ्या प्रत्येक क्रमांकाने दिलेल्या रंगाच्या शाईची टक्केवारी दर्शवते जी रंग संयोजन बनवते किंवा अधिक स्पष्टपणे, दिलेल्या रंगाच्या फिल्मवरील फोटोटाइपसेटिंग मशीनवर आउटपुट केलेल्या स्क्रीन डॉटचा आकार ( किंवा CTP च्या बाबतीत थेट प्रिंटिंग प्लेटवर).

उदाहरणार्थ, PANTONE 7526 रंग मिळविण्यासाठी, तुम्ही 9 भाग निळसर, 83 भाग किरमिजी, 100 भाग पिवळे आणि 46 भाग काळे मिक्स कराल. हे खालीलप्रमाणे सूचित केले जाऊ शकते: (9,83,100,46). कधीकधी खालील पदनाम वापरले जातात: C9M83Y100K46, किंवा (9%, 83%, 100%, 46%), किंवा (0.09/0.83/1.0/0.46).

HSB/HSV

HSB (HSV म्हणूनही ओळखले जाते) HSL सारखेच आहे, परंतु ते दोन भिन्न रंगाचे मॉडेल आहेत. ते दोन्ही दंडगोलाकार भूमितीवर आधारित आहेत, परंतु HSB/HSV "हेक्सकोन" मॉडेलवर आधारित आहे, तर HSL "द्वि-हेक्सकोन" मॉडेलवर आधारित आहे. कलाकार बहुतेकदा हे मॉडेल वापरण्यास प्राधान्य देतात, हे सामान्यतः स्वीकारले जाते की HSB/HSV डिव्हाइस रंगांच्या नैसर्गिक आकलनाच्या जवळ आहे. विशेषतः, Adobe Photoshop मध्ये HSB कलर मॉडेल वापरले जाते.

HSB/HSV म्हणजे ह्यू (रंग/रंग), संपृक्तता (संपृक्तता), ब्राइटनेस/व्हॅल्यू (ब्राइटनेस/व्हॅल्यू).

ह्यू कलर व्हीलवरील रंगाचे स्थान निर्दिष्ट करते (0 ते 360 पर्यंत). संपृक्तता हे संपृक्ततेचे टक्केवारी मूल्य आहे (0% ते 100% पर्यंत). ब्राइटनेस ही ब्राइटनेसची टक्केवारी आहे (0% ते 100% पर्यंत).

XYZ

XYZ कलर मॉडेल (CIE 1931 XYZ) ही पूर्णपणे गणितीय जागा आहे. RGB, CMYK आणि इतर मॉडेल्सच्या विपरीत, XYZ मध्ये मुख्य घटक "काल्पनिक" आहेत, म्हणजे तुम्ही X, Y, आणि Z यांना मिश्रण करण्यासाठी रंगांच्या कोणत्याही संचाशी जोडू शकत नाही. XYZ हे तांत्रिक क्षेत्रात वापरल्या जाणाऱ्या इतर सर्व रंगांच्या मॉडेल्ससाठी मुख्य मॉडेल आहे.

LAB

LAB कलर मॉडेल (CIELAB, “CIE 1976 L*a*b*”) CIE XYZ जागेवरून मोजले जाते. लॅबची रचना रंगाची जागा तयार करण्यासाठी डिझाइन केली गेली होती ज्यामध्ये रंग बदल मानवी धारणा (XYZ च्या तुलनेत) च्या दृष्टीने अधिक रेखीय असेल, म्हणजे, रंगाच्या वेगवेगळ्या भागात समान मूल्ये समन्वयित करण्यासाठी रंग बदलतात. जागा रंग बदलण्याची समान संवेदना निर्माण करेल.

व्लाड मर्झेविच

एचटीएमएलमध्ये, रंग दोनपैकी एका प्रकारे निर्दिष्ट केला जातो: हेक्साडेसिमल कोड वापरून आणि विशिष्ट रंगांच्या नावाने. हेक्साडेसिमल संख्या प्रणालीवर आधारित पद्धत प्रामुख्याने वापरली जाते, कारण ती सर्वात सार्वत्रिक आहे.

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

रंग निर्दिष्ट करण्यासाठी 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 लिहिण्याची परवानगी आहे.

एचटीएमएलमध्ये वापरलेला ठराविक रंग असा दिसतो.

येथे वेब पृष्ठाचा पार्श्वभूमी रंग #FA8E47 वर सेट केला आहे. संख्येच्या समोर हॅश चिन्ह # म्हणजे हेक्साडेसिमल आहे. पहिले दोन अंक (FA) रंगाचा लाल घटक परिभाषित करतात, तिसरा ते चौथा अंक (8E) हिरवा घटक परिभाषित करतात आणि शेवटचे दोन अंक (47) निळ्या घटकाची व्याख्या करतात. अंतिम परिणाम हा रंग असेल.

तीन रंगांपैकी प्रत्येक - लाल, हिरवा आणि निळा - 00 ते FF पर्यंत मूल्ये घेऊ शकतात, परिणामी एकूण 256 छटा आहेत. अशा प्रकारे, रंगांची एकूण संख्या 256x256x256 = 16,777,216 संयोजन असू शकते. लाल, हिरवा आणि निळा घटकांवर आधारित रंग मॉडेलला RGB (लाल, हिरवा, निळा) म्हणतात. हे मॉडेल ऍडिटीव्ह आहे (जोड - जोडा पासून), ज्यामध्ये सर्व तीन घटक जोडल्याने रंग पांढरा बनतो.

हेक्साडेसिमल रंग नॅव्हिगेट करणे सोपे करण्यासाठी, काही नियम विचारात घ्या.

• जर रंग घटकांची मूल्ये समान असतील (उदाहरणार्थ: #D6D6D6), तर परिणाम राखाडी रंगाचा असेल. #000000 (काळा) पासून #FFFFFF (पांढरा) पर्यंतच्या मूल्यांसह, संख्या जितकी जास्त असेल तितका फिकट रंग.
• लाल घटक जास्तीत जास्त (FF) बनवल्यास आणि उर्वरित घटक शून्यावर सेट केल्यास चमकदार लाल रंग तयार होतो. #FF0000 चे मूल्य असलेला रंग हा शक्य तितकी लाल रंगाची छटा आहे. हिरवा (#00FF00) आणि निळा (#0000FF) साठी हेच खरे आहे.
• पिवळा (#FFFF00) लाल आणि हिरवा मिक्स करून बनवला जातो. हे कलर व्हील (चित्र 6.1) वर स्पष्टपणे दृश्यमान आहे, जे प्राथमिक रंग (लाल, हिरवा, निळा) आणि पूरक किंवा अतिरिक्त रंग सादर करते. यामध्ये पिवळा, निळसर आणि वायलेट (ज्याला किरमिजी देखील म्हणतात) यांचा समावेश आहे. सर्वसाधारणपणे, कोणताही रंग त्याच्या जवळ रंग मिसळून मिळवता येतो. अशा प्रकारे, निळा आणि हिरवा एकत्र करून निळसर (#00FFFF) प्राप्त केला जातो.

तांदूळ. ६.१. रंगीत चाक

हेक्साडेसिमल मूल्यांवर आधारित रंग प्रायोगिकरित्या निवडले जाणे आवश्यक नाही. या उद्देशासाठी, एक ग्राफिक संपादक जो भिन्न रंग मॉडेलसह कार्य करू शकतो, उदाहरणार्थ, Adobe Photoshop, योग्य आहे. अंजीर मध्ये. आकृती 6.2 या प्रोग्राममध्ये रंग निवडण्यासाठी विंडो दर्शवते; तुम्ही ते तुमच्या कोडमध्ये कॉपी आणि पेस्ट करू शकता.

तांदूळ. ६.२. फोटोशॉपमध्ये रंग निवडण्यासाठी विंडो

वेब रंग

जर तुम्ही मॉनिटरची कलर रेंडरिंग गुणवत्ता 8-बिट (256 रंग) वर सेट केली असेल, तर तोच रंग वेगवेगळ्या ब्राउझरमध्ये वेगळ्या प्रकारे प्रदर्शित केला जाऊ शकतो. जेव्हा ब्राउझर त्याच्या स्वतःच्या पॅलेटसह कार्य करतो आणि त्याच्या पॅलेटमध्ये नसलेला रंग दर्शवू शकत नाही तेव्हा हे ग्राफिक्स प्रदर्शित करण्याच्या पद्धतीमुळे होते. या प्रकरणात, रंग इतरांच्या पिक्सेलच्या संयोजनाने बदलला जातो, त्याच्या जवळ, दिलेल्या रंगाचे अनुकरण करणारे रंग. वेगवेगळ्या ब्राउझरमध्ये रंग समान राहील याची खात्री करण्यासाठी, तथाकथित वेब रंगांचे पॅलेट सादर केले गेले. वेब रंग हे असे रंग आहेत ज्यासाठी प्रत्येक घटक - लाल, हिरवा आणि निळा - सहा मूल्यांपैकी एकावर सेट केला आहे - 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC) , 255 (FF). या घटकाचे हेक्साडेसिमल मूल्य कंसात दर्शविले आहे. सर्व संभाव्य संयोजनांमधील रंगांची एकूण संख्या 6x6x6 - 216 रंग देते. वेब रंगाचे उदाहरण #33FF66 आहे.

वेब कलरचे मुख्य वैशिष्ट्य म्हणजे ते सर्व ब्राउझरमध्ये सारखेच दिसते. याक्षणी, मॉनिटर्सच्या गुणवत्तेत सुधारणा आणि त्यांच्या क्षमतांच्या विस्तारामुळे वेब रंगांची प्रासंगिकता फारच लहान आहे.

नावानुसार रंग

संख्यांचा संच लक्षात ठेवू नये म्हणून, तुम्ही त्याऐवजी सामान्यतः वापरल्या जाणाऱ्या रंगांची नावे वापरू शकता. टेबलमध्ये 6.3 लोकप्रिय रंगांच्या नावांची नावे दर्शविते.

तुम्ही रंग त्याच्या नावाने किंवा हेक्साडेसिमल संख्या वापरून निर्दिष्ट केलात की नाही हे महत्त्वाचे नाही. या पद्धती त्यांच्या प्रभावात समान आहेत. उदाहरण 6.1 वेब पृष्ठाची पार्श्वभूमी आणि मजकूर रंग कसा सेट करायचा ते दाखवते.

उदाहरण 6.1. पार्श्वभूमी आणि मजकूर रंग

उदाहरण मजकूर

या उदाहरणात, टॅगच्या bgcolor विशेषता वापरून पार्श्वभूमी रंग सेट केला आहे , आणि मजकूर गुणधर्माद्वारे मजकूर रंग. विविधतेसाठी, मजकूर विशेषता हेक्साडेसिमल क्रमांकावर सेट केली जाते आणि bgcolor विशेषता आरक्षित कीवर्ड टीलवर सेट केली जाते.