HSV से HEX कनवर्टर

कोई फॉर्मूला लिखे बिना HSV रंग मानों को HEX कोड में परिवर्तित करें। यह कनवर्टर तब उपयोगी होता है जब रंग पिकर या ग्राफिक्स टूल HSV में रंग दिखाते हैं, लेकिन आपका CSS, टोकन, या कॉन्फ़िगरेशन फ़ाइलें HEX का उपयोग करती हैं।

HSV प्रारूप में एक रंग दर्ज करें और आपको तुरंत मिलान HEX कोड मिलेगा। आप इंटरैक्टिव रूप से रंग, संतृप्ति और मान को समायोजित कर सकते हैं और फिर परिणामी HEX मान को अपनी शैलियों या डिज़ाइन सिस्टम में कॉपी कर सकते हैं।

इस पृष्ठ पर आपको HSV और HEX का संक्षिप्त विवरण, रूपांतरण सूत्र का स्पष्ट विवरण, एक चरण-दर-चरण उदाहरण, एक संदर्भ तालिका, और इन प्रारूपों का एक साथ उपयोग करने के बारे में सामान्य प्रश्नों के उत्तर भी मिलेंगे।

HSV क्या है

HSV का अर्थ है Hue, Saturation, और Value। यह रंगों का प्रतिनिधित्व रंग पहिये पर एक रंग कोण, उस रंग की तीव्रता, और काले के मुकाबले रंग की चमक के रूप में करता है।

Hue को 0 से 360 डिग्री में लिखा जाता है। Saturation और value प्रतिशत में होते हैं, जो 0% से 100% तक होते हैं। जब संतृप्ति कम होती है, तो रंग म्यूटेड और ग्रे के करीब दिखते हैं। जब मान कम होता है, तो रंग गहरे और काले के करीब हो जाते हैं।

यह लेआउट HSV को रंग पिकर्स और डिजिटल पेंटिंग सॉफ़्टवेयर में एक लोकप्रिय विकल्प बनाता है। यह लोगों को रंगों के बारे में इस तरह से बात करने की अनुमति देता है कि वे कितने मजबूत और कितने उज्ज्वल महसूस करते हैं, बजाय इसके कि वे तीन स्वतंत्र RGB चैनलों के बारे में सोचें।

HEX रंग कोड क्या है

एक HEX रंग RGB रंग को हेक्साडेसिमल संख्या प्रणाली का उपयोग करके लिखने का एक संक्षिप्त तरीका है। मानक रूप #RRGGBB है, जहां प्रत्येक वर्ण जोड़ी लाल, हरा, और नीला चैनल का प्रतिनिधित्व करती है।

प्रत्येक जोड़ी 00 से FF तक जाती है। 00 के करीब एक मान का अर्थ है कि चैनल बहुत कम योगदान देता है, जबकि FF के करीब एक मान का अर्थ है कि चैनल पूरी ताकत पर है। उदाहरण के लिए, #000000 काला है, #FFFFFF सफेद है, और #FFA500 एक उज्ज्वल नारंगी है।

ब्राउज़र और उपकरण HEX स्ट्रिंग को पार्स करते हैं, इसे तीन जोड़ों में विभाजित करते हैं, प्रत्येक जोड़ी को दशमलव संख्या में परिवर्तित करते हैं, और फिर परिणाम के साथ RGB के रूप में काम करते हैं। इसलिए, HEX वास्तव में RGB के चारों ओर एक संक्षिप्त और पठनीय लपेटन है जो CSS और डिज़ाइन टोकन में अच्छी तरह से फिट बैठता है।

HSV से HEX रूपांतरण सूत्र

hsv(h, s, v) -> #RRGGBB

दिया गया:
  h [0, 360) में
  s [0, 100] में
  v [0, 100] में

1) HSV को RGB में बदलें (मध्यवर्ती चरण):
   a) सैचुरेशन और मान को सामान्यीकृत करें:
      s' = s / 100
      v' = v / 100
   b) क्रोमा की गणना करें:
      c = v' * s'
   c) सहायक मान:
      x = c * (1 - |((h / 60) mod 2) - 1|)
   d) ह्यू सेक्टर के आधार पर अस्थायी ट्रिपल:
      यदि    0 <= h < 60   तो (r1, g1, b1) = (c, x, 0)
      अन्यथा यदि 60 <= h < 120 तो (r1, g1, b1) = (x, c, 0)
      अन्यथा यदि 120 <= h < 180 तो (r1, g1, b1) = (0, c, x)
      अन्यथा यदि 180 <= h < 240 तो (r1, g1, b1) = (0, x, c)
      अन्यथा यदि 240 <= h < 300 तो (r1, g1, b1) = (x, 0, c)
      अन्यथा                        (r1, g1, b1) = (c, 0, x)
   e) ऑफसेट जोड़ें:
      m  = v' - c
      r' = r1 + m
      g' = g1 + m
      b' = b1 + m
   f) 0-255 तक स्केल करें:
      r = round(r' * 255)
      g = round(g' * 255)
      b = round(b' * 255)

2) RGB को HEX में बदलें:
   RR = dec_to_hex(r)
   GG = dec_to_hex(g)
   BB = dec_to_hex(b)

   dec_to_hex(x) = to_hex(x).padStart(2, "0")

3) भागों को जोड़ें:
   #RRGGBB

व्यवहार में, कनवर्टर पहले HSV रंग का RGB प्रतिनिधित्व बनाता है और फिर प्रत्येक चैनल को दो अंकों वाले हेक्साडेसिमल स्ट्रिंग के रूप में फिर से लिखता है। दृश्य रंग वही रहता है; केवल पाठ प्रारूप HSV से HEX में बदलता है।

hsv(196, 59%, 76%) के लिए उदाहरण
1) ऊपर दिए गए नियमों का उपयोग करके HSV को RGB में बदलें
2) मान लें कि राउंडेड RGB परिणाम है:
   rgb(79, 163, 194)
3) प्रत्येक चैनल को HEX में बदलें:
   79  -> 4F
   163 -> A3
   194 -> C2
4) अंतिम HEX:
   #4FA3C2

HSV से HEX रूपांतरण कैसे काम करता है चरण दर चरण

हालांकि HSV से HEX एल्गोरिदम पहली नज़र में लंबा लगता है, यह हमेशा एक ही पैटर्न का पालन करता है। आप HSV को RGB रंग के रूप में व्याख्या करते हैं और फिर उस RGB रंग को HEX नोटेशन में लिखते हैं।

hsv(210, 57%, 24%)
-> rgb(r, g, b)
-> #RRGGBB

यहाँ hsv(210, 57%, 24%) के लिए एक सरल मार्गदर्शिका है।

  • चरण 1 - HSV को RGB में परिवर्तित करें

    संतृप्ति और मान को सामान्य करें, क्रोमा और सहायक मान की गणना करें, रंग क्षेत्र के आधार पर एक अस्थायी त्रिकोण का चयन करें, फिर ऑफसेट जोड़ें और 0 से 255 रेंज में स्केल करें।

    s' = 57 / 100
v' = 24 / 100
rgb(26, 43, 60) राउंडिंग के बाद
  • चरण 2 - RGB चैनलों को HEX में अनुवाद करें

    प्रत्येक RGB चैनल को हेक्साडेसिमल में परिवर्तित करें और यदि आवश्यक हो तो अग्रणी शून्य के साथ पैड करें। यह सुनिश्चित करता है कि अंतिम HEX कोड हमेशा हैश प्रतीक के बाद छह अंकों का होता है।

    26 -> 1A
43 -> 2B
60 -> 3C
  • चरण 3 - टुकड़ों को एक HEX स्ट्रिंग में जोड़ें

    तीन जोड़ों को जोड़ें और # को पहले जोड़ें। परिणाम मूल HSV रंग का HEX प्रतिनिधित्व है।

    #1A2B3C

यह प्रवाह किसी भी मान्य HSV इनपुट के लिए काम करता है, इसलिए एक कनवर्टर या उपयोगिता फ़ंक्शन आमतौर पर स्मृति से गणित को फिर से करने की कोशिश करने की तुलना में अधिक विश्वसनीय होता है।

HSV और HEX के बीच चयन करना

HSV और HEX विभिन्न समस्याओं को हल करते हैं। HSV इंटरैक्टिव संपादन और अन्वेषण के लिए सुविधाजनक है, जबकि HEX संग्रहण और साझा करने के लिए संक्षिप्त और स्थिर है।

जब HSV अधिक व्यावहारिक हो

  • रंग पिकर्स और स्लाइडर्स: रंग, संतृप्ति, और मान को सरल नियंत्रणों के साथ समायोजित करना आसान है।
  • भिन्नताओं का अन्वेषण: मान या संतृप्ति में छोटे बदलाव जल्दी से एक आधार रंग के हल्के, गहरे, या अधिक जीवंत संस्करण उत्पन्न करते हैं।
  • कलाकार के अनुकूल नियंत्रण: इस कारण से कई पेंटिंग टूल और 3D अनुप्रयोग रंगों को HSV में प्रस्तुत करते हैं।

जब HEX बेहतर हो

  • डिज़ाइन टोकन और पैलेट: संक्षिप्त HEX स्ट्रिंग्स ब्रांड और तटस्थ रंगों के लिए अंतिम मान के रूप में अच्छी तरह से काम करती हैं।
  • उपकरणों के बीच कॉपी करना: अधिकांश संपादक और ब्राउज़र रंगों को HEX के रूप में प्रदर्शित करते हैं, इसलिए आप बिना अतिरिक्त रूपांतरण चरणों के मानों को कॉपी और पेस्ट कर सकते हैं।
  • पठनीय कॉन्फ़िगरेशन: HEX कोड JSON, CSS, और दस्तावेज़ तालिकाओं में पंक्तिबद्ध करना आसान है।

सारांश

HSV का उपयोग करें जब आप रंगों का प्रयोग और समायोजन कर रहे हों। उन रंगों को HEX में परिवर्तित करें जब आप कोड और डिज़ाइन सिस्टम के लिए एक संक्षिप्त, स्थिर प्रतिनिधित्व चाहते हों।

HSV और HEX का एक साथ उपयोग करने के लिए सर्वोत्तम प्रथाएँ

आपको पूरे प्रोजेक्ट के लिए एक ही रंग प्रारूप चुनने की आवश्यकता नहीं है। नियमों के एक सरल सेट के साथ, आप बिना भ्रम पैदा किए HSV और HEX का एक साथ उपयोग कर सकते हैं।

संपादन को संग्रहण से अलग करें

  • संपादन के लिए HSV का उपयोग करें: पिकर्स और आंतरिक उपकरणों में रंग, संतृप्ति, और मान को समायोजित करें।
  • टोकन के लिए HEX का उपयोग करें: CSS, दस्तावेज़, और निर्यातित डिज़ाइन फ़ाइलों के लिए अंतिम रंग HEX में संग्रहित करें।

आवश्यकतानुसार अन्य मॉडलों के साथ मिलाएं

  • RGB या HSL के माध्यम से परिवर्तित करें: कई पुस्तकालय पहले से ही HSV से RGB या HSV से HSL के लिए सहायक प्रदान करते हैं, जिन्हें आप HEX रूपांतरण के साथ जोड़ सकते हैं।
  • पारदर्शिता के लिए RGBA या HEX के साथ अल्फा का उपयोग करें: आधार रंग HEX के रूप में संग्रहित किए जा सकते हैं, जबकि ओवरले और छायाएँ RGBA या आठ अंकों वाले HEX का उपयोग करती हैं जिसमें एक अल्फा घटक होता है।

सिस्टम को पूर्वानुमानित रखें

  • स्पष्ट जिम्मेदारियाँ परिभाषित करें: उदाहरण के लिए, पिकर्स में HSV, टोकन में HEX, और RGB जहां ग्राफिक्स API इसकी मांग करता है।
  • हाथ से पुनर्गणना से बचें: HEX या HSV मानों को हाथ से संपादित करने के बजाय कनवर्टर्स और उपयोगिता फ़ंक्शंस पर भरोसा करें।

थोड़ी सी संरचना के साथ, आप सहज HSV संपादन का आनंद ले सकते हैं और फिर भी उत्पादन में एक साफ, HEX आधारित रंग प्रणाली भेज सकते हैं।

HSV से HEX रूपांतरण तालिका

नीचे दी गई तालिका में सामान्य रंगों का चयन है जो HSV और HEX दोनों रूपों में लिखे गए हैं। मानों को पढ़ने में आसान रखने के लिए गोल किया गया है, इसलिए जब आपको सटीक संख्या की आवश्यकता हो, तो पृष्ठ के शीर्ष पर कनवर्टर का उपयोग करें।

HSV से HEX संदर्भ तालिका
विवरणHSVHEX
सफेदhsv(0, 0%, 100%)#FFFFFF
कालाhsv(0, 0%, 0%)#000000
लालhsv(0, 100%, 100%)#FF0000
हराhsv(120, 100%, 100%)#00FF00
नीलाhsv(240, 100%, 100%)#0000FF
पीलाhsv(60, 100%, 100%)#FFFF00
सियानhsv(180, 100%, 100%)#00FFFF
मैजेंटाhsv(300, 100%, 100%)#FF00FF
ग्रे 1hsv(0, 0%, 7%)#111111
ग्रे 2hsv(0, 0%, 20%)#333333
ग्रे 3hsv(0, 0%, 33%)#555555
ग्रे 4hsv(0, 0%, 47%)#777777
ग्रे 5hsv(0, 0%, 60%)#999999
ग्रे 6hsv(0, 0%, 80%)#CCCCCC
नारंगीhsv(39, 100%, 100%)#FFA500
बैंगनीhsv(300, 100%, 50%)#800080
टीलhsv(180, 100%, 50%)#008080

किसी अन्य HSV संयोजन के लिए, आप पृष्ठ के शीर्ष पर कनवर्टर पर भरोसा कर सकते हैं, जो सटीक मानों की गणना के लिए मानक HSV से RGB से HEX एल्गोरिदम लागू करता है।

अक्सर पूछे जाने वाले प्रश्न: HSV से HEX

  • HSV को HEX में क्यों परिवर्तित करें

    HSV संपादन और पिकर्स के लिए सुविधाजनक है, लेकिन HEX कोड, स्टाइल गाइड, और निर्यातित पैलेट के लिए एक सामान्य प्रारूप है। रूपांतरण आपको सहज संपादन मॉडल से संक्षिप्त संग्रहण प्रारूप में जाने की अनुमति देता है।

  • क्या HSV और HEX विभिन्न रंगों का प्रतिनिधित्व करते हैं

    नहीं। HEX केवल उसी RGB रंग को लिखने का एक अलग तरीका है जो आपको एक HSV मान से मिलता है। जब तक रूपांतरण सही है, दोनों प्रारूप समान दृश्य रंग का वर्णन करते हैं।

  • क्या रूपांतरण करते समय रंग बदलता है

    रंग की जानकारी HSV से RGB चरण के माध्यम से संरक्षित रहती है। जब आप अंतिम HEX स्ट्रिंग देखते हैं, तो वह रंग RGB चैनलों के अंदर एन्कोडेड होता है जिसे HEX मान दर्शाता है।

  • क्या मैं HEX से HSV में वापस जा सकता हूँ

    हाँ। आप HEX को RGB में परिवर्तित कर सकते हैं, फिर RGB को HSV में परिवर्तित कर सकते हैं। छोटे गोलाई के अंतर के अलावा, मूल रंग को पुनः प्राप्त किया जा सकता है।

  • क्या HEX हमेशा HSV से बेहतर है

    हर स्थिति में नहीं। HEX अंतिम संग्रहण और साझा करने के प्रारूप के रूप में चमकता है, जबकि HSV लाइव समायोजन और दृश्य अन्वेषण के लिए बेहतर है। एक कार्यप्रवाह में दोनों का एक साथ उपयोग करना सामान्य है।

संबंधित कनवर्टर:

सभी रंग कन्वर्टर्स देखें