javascript - आरजीबी से हेक्स और हेक्स से आरजीबी तक




colors hex rgb (25)

आरजीबी प्रारूप में रंगों को हेक्स प्रारूप में कैसे परिवर्तित करें और इसके विपरीत?

उदाहरण के लिए, '#0080C0' को (0, 128, 192) कनवर्ट करें।


Answers

हेक्स 2 आरबीजी का मेरा संस्करण:

  1. # एफएफएफ जैसे छोटे हेक्स स्वीकार करें
  2. एल्गोरिदम क्षमता ओ (एन) है, रेगेक्स का उपयोग करने से तेज होना चाहिए। उदाहरण के लिए String.replace, String.split, String.match आदि ..
  3. निरंतर स्थान का प्रयोग करें।
  4. समर्थन आरजीबी और आरजीबीए।

यदि आप आईई 8 का उपयोग कर रहे हैं तो आपको hex.trim () को हटाने की आवश्यकता हो सकती है।

जैसे

hex2rgb('#fff') //rgb(255,255,255) 
hex2rgb('#fff', 1) //rgba(255,255,255,1) 
hex2rgb('#ffffff') //rgb(255,255,255)  
hex2rgb('#ffffff', 1) //rgba(255,255,255,1)

कोड:

function hex2rgb (hex, opacity) {
    hex = hex.trim();
    hex = hex[0] === '#' ? hex.substr(1) : hex;
    var bigint = parseInt(hex, 16), h = [];
    if (hex.length === 3) {
        h.push((bigint >> 4) & 255);
        h.push((bigint >> 2) & 255);
    } else {
        h.push((bigint >> 16) & 255);
        h.push((bigint >> 8) & 255);
    }
    h.push(bigint & 255);
    if (arguments.length === 2) {
        h.push(opacity);
        return 'rgba('+h.join()+')';
    } else {
        return 'rgb('+h.join()+')';
    }
}

मुझे ऐसे फ़ंक्शन की आवश्यकता है जो अमान्य मानों को भी स्वीकार करे

आरजीबी (-255, 255, 255) आरजीबी (510, 255, 255)

यह @cwolves उत्तर का एक स्पिन बंद है

function rgb(r, g, b) {
  this.c = this.c || function (n) {
    return Math.max(Math.min(n, 255), 0)
  };

  return ((1 << 24) + (this.c(r) << 16) + (this.c(g) << 8) + this.c(b)).toString(16).slice(1).toUpperCase();
}

निम्नलिखित आरजीबी को हेक्स रूपांतरण में करेंगे और कोई भी आवश्यक शून्य पैडिंग जोड़ें:

function componentToHex(c) {
    var hex = c.toString(16);
    return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
    return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

alert( rgbToHex(0, 51, 255) ); // #0033ff

दूसरी तरफ कनवर्ट करना:

function hexToRgb(hex) {
    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
    return result ? {
        r: parseInt(result[1], 16),
        g: parseInt(result[2], 16),
        b: parseInt(result[3], 16)
    } : null;
}

alert( hexToRgb("#0033ff").g ); // "51";

अंत में, rgbToHex() का एक वैकल्पिक संस्करण, जैसा कि @ कैसाब्लांका के उत्तर में चर्चा की गई है और @cwolves द्वारा टिप्पणियों में सुझाव दिया गया है:

function rgbToHex(r, g, b) {
    return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}

3 दिसंबर 2012 अपडेट करें

यहां hexToRgb() का एक संस्करण है जो "# 03F" जैसे शॉर्टेंड हेक्स ट्रिपलेट को भी hexToRgb() करता है:

function hexToRgb(hex) {
    // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
    var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
    hex = hex.replace(shorthandRegex, function(m, r, g, b) {
        return r + r + g + g + b + b;
    });

    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
    return result ? {
        r: parseInt(result[1], 16),
        g: parseInt(result[2], 16),
        b: parseInt(result[3], 16)
    } : null;
}

alert( hexToRgb("#0033ff").g ); // "51";
alert( hexToRgb("#03f").g ); // "51";

इसका उपयोग गणना की शैली की प्रजातियों से रंग प्राप्त करने के लिए किया जा सकता है:

function rgbToHex(color) {
    color = ""+ color;
    if (!color || color.indexOf("rgb") < 0) {
        return;
    }

    if (color.charAt(0) == "#") {
        return color;
    }

    var nums = /(.*?)rgb\((\d+),\s*(\d+),\s*(\d+)\)/i.exec(color),
        r = parseInt(nums[2], 10).toString(16),
        g = parseInt(nums[3], 10).toString(16),
        b = parseInt(nums[4], 10).toString(16);

    return "#"+ (
        (r.length == 1 ? "0"+ r : r) +
        (g.length == 1 ? "0"+ g : g) +
        (b.length == 1 ? "0"+ b : b)
    );
}

// not computed 
<div style="color: #4d93bc; border: 1px solid red;">...</div> 
// computed 
<div style="color: rgb(77, 147, 188); border: 1px solid rgb(255, 0, 0);">...</div>

console.log( rgbToHex(color) ) // #4d93bc
console.log( rgbToHex(borderTopColor) ) // #ff0000

रेफरी: https://github.com/k-gun/so/blob/master/so_util.js#L43


R = HexToR("#FFFFFF");
G = HexToG("#FFFFFF");
B = HexToB("#FFFFFF");

function HexToR(h) {return parseInt((cutHex(h)).substring(0,2),16)}
function HexToG(h) {return parseInt((cutHex(h)).substring(2,4),16)}
function HexToB(h) {return parseInt((cutHex(h)).substring(4,6),16)}
function cutHex(h) {return (h.charAt(0)=="#") ? h.substring(1,7):h}

बिना किसी मुद्दे के परिणाम प्राप्त करने के लिए इन फ़ंक्शन का उपयोग करें। :)


आरजीबीए के लिए एक लाइन कार्यात्मक हेक्स

लघु #ffffff और लंबे #ffffff रूपों दोनों का समर्थन करता है।
अल्फा चैनल (अस्पष्टता) का समर्थन करता है।
यदि हश निर्दिष्ट है या नहीं, तो दोनों मामलों में काम नहीं करता है।

function hexToRGBA(hex, opacity) {
    return 'rgba(' + (hex = hex.replace('#', '')).match(new RegExp('(.{' + hex.length/3 + '})', 'g')).map(function(l) { return parseInt(hex.length%2 ? l+l : l, 16) }).concat(opacity||1).join(',') + ')';
}

उदाहरण:

hexToRGBA('#fff')        ->  rgba(255,255,255,1)  
hexToRGBA('#ffffff')     ->  rgba(255,255,255,1)  
hexToRGBA('#fff', .2)    ->  rgba(255,255,255,0.2)  
hexToRGBA('#ffffff', .2) ->  rgba(255,255,255,0.2)  
hexToRGBA('fff', .2)     ->  rgba(255,255,255,0.2)  
hexToRGBA('ffffff', .2)  ->  rgba(255,255,255,0.2)  

रेक्स के बिना हेक्स रंग कोड को आरजीबी में परिवर्तित करने के लिए एक अलग दृष्टिकोण

यह स्ट्रिंग की लंबाई के आधार पर #FFFFFF #FFF और #FFFFFF प्रारूप दोनों को संभालता है। यह स्ट्रिंग की शुरुआत से # हटा देता है और स्ट्रिंग के प्रत्येक अक्षर को विभाजित करता है और इसे बेस 10 में परिवर्तित करता है और इसे अपनी स्थिति के आधार पर संबंधित इंडेक्स में जोड़ता है।

//Algorithm of hex to rgb conversion in ES5
function hex2rgbSimple(str){
  str = str.replace('#', '');
  return str.split('').reduce(function(result, char, index, array){
    var j = parseInt(index * 3/array.length);
    var number = parseInt(char, 16);
    result[j] = (array.length == 3? number :  result[j]) * 16 + number;
    return result;
  },[0,0,0]);
}

//Same code in ES6
hex2rgb = str => str.replace('#','').split('').reduce((r,c,i,{length: l},j,n)=>(j=parseInt(i*3/l),n=parseInt(c,16),r[j]=(l==3?n:r[j])*16+n,r),[0,0,0]);

//hex to RGBA conversion
hex2rgba = (str, a) => str.replace('#','').split('').reduce((r,c,i,{length: l},j,n)=>(j=parseInt(i*3/l),n=parseInt(c,16),r[j]=(l==3?n:r[j])*16+n,r),[0,0,0,a||1]);

//hex to standard RGB conversion
hex2rgbStandard = str => `RGB(${str.replace('#','').split('').reduce((r,c,i,{length: l},j,n)=>(j=parseInt(i*3/l),n=parseInt(c,16),r[j]=(l==3?n:r[j])*16+n,r),[0,0,0]).join(',')})`;


console.log(hex2rgb('#aebece'));
console.log(hex2rgbSimple('#aebece'));

console.log(hex2rgb('#aabbcc'));

console.log(hex2rgb('#abc'));

console.log(hex2rgba('#abc', 0.7));

console.log(hex2rgbStandard('#abc'));


// एचएसएल नोटेशन को अनदेखा करते हुए, रंग मान आमतौर पर नाम, आरजीबी, आरजीबीए या हेक्स-

// हेक्स 3 मान या 6 हो सकता है।

// आरजीबी प्रतिशत के साथ ही पूर्णांक मान हो सकता है।

// कम से कम इन सभी प्रारूपों के लिए सर्वश्रेष्ठ खाते में।

String.prototype.padZero= function(len, c){
    var s= this, c= c || "0", len= len || 2;
    while(s.length < len) s= c + s;
    return s;
}
var colors={
    colornames:{
        aqua: '#00ffff', black: '#000000', blue: '#0000ff', fuchsia: '#ff00ff',
        gray: '#808080', green: '#008000', lime: '#00ff00', maroon: '#800000',
        navy: '#000080', olive: '#808000', purple: '#800080', red: '#ff0000',
        silver: '#c0c0c0', teal: '#008080', white: '#ffffff', yellow: '#ffff00'
    },
    toRgb: function(c){
        c= '0x'+colors.toHex(c).substring(1);
        c= [(c>> 16)&255, (c>> 8)&255, c&255];
        return 'rgb('+c.join(',')+')';
    },
    toHex: function(c){
        var tem, i= 0, c= c? c.toString().toLowerCase(): '';
        if(/^#[a-f0-9]{3,6}$/.test(c)){
            if(c.length< 7){
                var A= c.split('');
                c= A[0]+A[1]+A[1]+A[2]+A[2]+A[3]+A[3];
            }
            return c;
        }
        if(/^[a-z]+$/.test(c)){
            return colors.colornames[c] || '';
        }
        c= c.match(/\d+(\.\d+)?%?/g) || [];
        if(c.length<3) return '';
        c= c.slice(0, 3);
        while(i< 3){
            tem= c[i];
            if(tem.indexOf('%')!= -1){
                tem= Math.round(parseFloat(tem)*2.55);
            }
            else tem= parseInt(tem);
            if(tem< 0 || tem> 255) c.length= 0;
            else c[i++]= tem.toString(16).padZero(2);
        }
        if(c.length== 3) return '#'+c.join('').toLowerCase();
        return '';
    }
}
//var c='#dc149c';
//var c='rgb(100%,25%,0)';
//
var c= 'red';
alert(colors.toRgb(c)+'\n'+colors.toHex(c));

(2017) सिंपल ES6 composable तीर फ़ंक्शन

मैं उन लोगों के लिए इसे साझा करने का विरोध नहीं कर सकता जो ES6 का उपयोग कर कुछ आधुनिक कार्यात्मक / रचनात्मक जेएस लिख रहे हों। यहां कुछ स्लिम एक-लाइनर हैं जो मैं एक रंग मॉड्यूल में उपयोग कर रहा हूं जो डेटा विज़ुअलाइज़ेशन के लिए रंग इंटरपोलेशन करता है।

ध्यान दें कि यह अल्फा चैनल को बिल्कुल संभाल नहीं करता है।

const arrayToRGBString = rgb => `rgb(${rgb.join(',')})`;
const hexToRGBArray = hex => hex.match(/[A-Za-z0-9]{2}/g).map(v => parseInt(v, 16));
const rgbArrayToHex = rgb => `#${rgb.map(v => v.toString(16).padStart(2, '0')).join('')}`;
const rgbStringToArray = rgb => rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/).splice(1, 3)
  .map(v => Number(v));
const rgbStringToHex = rgb => rgbArrayToHex(rgbStringToArray(rgb));

एचटीएमएल हेक्साडेसिमल सिस्टम का उपयोग करता है और आरजीबी दशमलव प्रणाली का उपयोग करता है। इसलिए आपको संख्या को हेक्साडेसिमल से दशमलव में परिवर्तित करना होगा और इसके विपरीत।


मेरा संस्करण यहाँ है:

  function rgb2hex(red, green, blue) {
        var rgb = blue | (green << 8) | (red << 16);
        return '#' + (0x1000000 + rgb).toString(16).slice(1)
  }

  function hex2rgb(hex) {
        // long version
        r = hex.match(/^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i);
        if (r) {
                return r.slice(1,4).map(function(x) { return parseInt(x, 16); });
        }
        // short version
        r = hex.match(/^#([0-9a-f])([0-9a-f])([0-9a-f])$/i);
        if (r) {
                return r.slice(1,4).map(function(x) { return 0x11 * parseInt(x, 16); });
        }
        return null;
  }

टिम डाउन के 3 अंकों हेक्सटॉर्ब फ़ंक्शन के लिए नीचे के रूप में सुधार किया जा सकता है:

var hex2Rgb = function(hex){
  var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})|([a-f\d]{1})([a-f\d]{1})([a-f\d]{1})$/i.exec(hex);
  return result ? {        
    r: parseInt(hex.length <= 4 ? result[4]+result[4] : result[1], 16),
    g: parseInt(hex.length <= 4 ? result[5]+result[5] : result[2], 16),
    b: parseInt(hex.length <= 4 ? result[6]+result[6] : result[3], 16),
    toString: function() {
      var arr = [];
      arr.push(this.r);
      arr.push(this.g);
      arr.push(this.b);
      return "rgb(" + arr.join(",") + ")";
    }
  } : null;
};

मैं एक्सएएमएल डेटा के साथ काम कर रहा हूं जिसमें #AARRGGBB (अल्फा, रेड, ग्रीन, ब्लू) का हेक्स प्रारूप है। ऊपर दिए गए उत्तरों का उपयोग करके, मेरा समाधान यहां है:

function hexToRgba(hex) {
    var bigint, r, g, b, a;
    //Remove # character
    var re = /^#?/;
    var aRgb = hex.replace(re, '');
    bigint = parseInt(aRgb, 16);

    //If in #FFF format
    if (aRgb.length == 3) {
        r = (bigint >> 4) & 255;
        g = (bigint >> 2) & 255;
        b = bigint & 255;
        return "rgba(" + r + "," + g + "," + b + ",1)";
    }

    //If in #RRGGBB format
    if (aRgb.length >= 6) {
        r = (bigint >> 16) & 255;
        g = (bigint >> 8) & 255;
        b = bigint & 255;
        var rgb = r + "," + g + "," + b;

        //If in #AARRBBGG format
        if (aRgb.length == 8) {
            a = ((bigint >> 24) & 255) / 255;
            return "rgba(" + rgb + "," + a.toFixed(1) + ")";
        }
    }
    return "rgba(" + rgb + ",1)";
}

http://jsfiddle.net/kvLyscs3/


टिम डाउन के उत्तर का ईसीएमएस्क्रिप्ट 6 संस्करण

आरजीबी को हेक्स में कनवर्ट करना

const rgbToHex = (r, g, b) => '#' + [r, g, b].map(x => {
  const hex = x.toString(16)
  return hex.length === 1 ? '0' + hex : hex
}).join('')

console.log(rgbToHex(0, 51, 255)); // '#0033ff'

हेक्स को आरजीबी में परिवर्तित करना

एक सरणी [r, g, b]"#03F" जैसे "#03F" हेक्स ट्रिपलेट्स के साथ भी काम करता है।

const hexToRgb = hex =>
  hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i
             ,(m, r, g, b) => '#' + r + r + g + g + b + b)
    .substring(1).match(/.{2}/g)
    .map(x => parseInt(x, 16))

console.log(hexToRgb("#0033ff")) // [0, 51, 255]
console.log(hexToRgb("#03f")) // [0, 51, 255]

ध्यान दें कि यह उत्तर ECMAScript की नवीनतम सुविधाओं का उपयोग करता है, जो पुराने ब्राउज़र में समर्थित नहीं हैं। यदि आप यह कोड सभी परिवेशों में काम करना चाहते हैं, तो आपको अपने कोड को संकलित करने के लिए Babel का उपयोग करना चाहिए।

बोनस: padStart() विधि का उपयोग कर आरजीबी से हेक्स तक

चेतावनी: निम्न कोड padStart() विधि का उपयोग करता है, जो वर्तमान में padStart() 2017 ड्राफ्ट का हिस्सा है । यह अभी तक सभी ब्राउज़रों द्वारा समर्थित नहीं है ( संगतता तालिका की जांच करें)। यदि आप आज इसका उपयोग करना चाहते हैं, तो बेबेल या padStart() उपयोग करें।

const rgbToHex = (r, g, b) => '#' + [r, g, b]
  .map(x => x.toString(16).padStart(2, '0')).join('')

console.log(rgbToHex(0, 51, 255)); // '#0033ff'


हालांकि यह उत्तर पूरी तरह से प्रश्न को फिट करने की संभावना नहीं है, लेकिन यह बहुत उपयोगी नहीं हो सकता है।

  1. कोई यादृच्छिक तत्व बनाएँ

var toRgb = document.createElement('div');

  1. उस रंग में कोई वैध शैली सेट करें जिसे आप कनवर्ट करना चाहते हैं

toRg.style.color = "hsl(120, 60%, 70%)";

  1. स्टाइल प्रॉपर्टी को दोबारा कॉल करें

> toRgb.style.color;

< "rgb(133, 225, 133)" आपका रंग आरजीबी में परिवर्तित कर दिया गया है

के लिए काम करता है: एचएसएल, हेक्स

काम नहीं करता है: नामित रंग


function getRGB(color){
  if(color.length == 7){
    var r = parseInt(color.substr(1,2),16);
    var g = parseInt(color.substr(3,2),16);
    var b = parseInt(color.substr(5,2),16);    
    return 'rgb('+r+','+g+','+b+')' ;
  }    
  else
    console.log('Enter correct value');
}
var a = getRGB('#f0f0f0');
if(!a){
 a = 'Enter correct value'; 
}

a;

यदि आपको दो रंग मानों की तुलना करने की आवश्यकता है (आरजीबी, नाम रंग या हेक्स मान के रूप में दिया गया है) या हेक्स का उपयोग एचटीएमएल 5 कैनवास ऑब्जेक्ट में कनवर्ट करें।

    var canvas = document.createElement("canvas");
    var ctx = this.canvas.getContext('2d');

    ctx.fillStyle = "rgb(pass,some,value)";
    var temp =  ctx.fillStyle;
    ctx.fillStyle = "someColor";

    alert(ctx.fillStyle == temp);

ऐसा लगता है कि आप इस तरह कुछ ढूंढ रहे हैं:

function hexstr(number) {
    var chars = new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f");
    var low = number & 0xf;
    var high = (number >> 4) & 0xf;
    return "" + chars[high] + chars[low];
}

function rgb2hex(r, g, b) {
    return "#" + hexstr(r) + hexstr(g) + hexstr(b);
}

बहुत सारे उत्तरों को ध्यान में रखते हुए केवल आंशिक रूप से प्रश्न का उत्तर देते हैं (या तो आरजीबी से हेक्स या दूसरी तरफ) मैंने सोचा कि मैं अपना आंशिक उत्तर भी पोस्ट करूंगा।

मेरे पास एक समान समस्या थी और मैं ऐसा कुछ करना चाहता था: किसी वैध सीएसएस रंग (एचएसएल (ए), आरजीबी (ए), हेक्स या रंग का नाम इनपुट करें) और 1. अल्फा मान जोड़ने या निकालने में सक्षम होना चाहिए, 2। एक आरजीबी (ए) वस्तु वापस करें। मैंने इस उद्देश्य के लिए बिल्कुल एक प्लगइन लिखा था। यह GitHub पर पाया जा सकता GitHub (इसे jQuery की आवश्यकता है, लेकिन यदि आप चाहते हैं कि आप इसे फोर्क कर सकते हैं और वेनिला संस्करण बना सकते हैं)। यहां एक डेमो पेज है । आप अपने लिए कोशिश कर सकते हैं और फ्लाई पर उत्पन्न आउटपुट देख सकते हैं।

मैं विकल्पों को कॉपी-पेस्ट कर दूंगा:

आरजीबी जेनरेटर एक तर्क, रंग स्वीकार करता है, और तीन विकल्प प्रदान करता है: asObject, addAlpha और removeAlpha। जब तीन विकल्प छोड़े जाते हैं, तो आरजीबी रंग स्ट्रिंग के रूप में वापस कर दिया जाएगा।

$.rgbGenerator("white")
// Will return rgb(255,255,255)

ध्यान दें कि डिफ़ॉल्ट अल्फा घटकों को शामिल किया गया है। यदि इनपुट मान में अल्फा मान होता है, तो आउटपुट आरजीबीए प्रारूप में होगा।

$.rgbGenerator("hsla(0,100%,50%,0.8)")
// Will return rgba(255,0,0,0.8)

आप clearAlpha को सही पर सेट करके इस व्यवहार को अक्षम कर सकते हैं। यह प्रारंभिक एचएसएलए या आरजीबीए रंग से किसी भी अल्फा मान को हटा देगा।

$.rgbGenerator("hsla(0,100%,50%,0.8)", {removeAlpha: true})
// Will return rgb(255,0,0)

यदि, दूसरी तरफ, आप अल्फा चैनल जोड़ना चाहते हैं, तो आप 0 और 1 के बीच किसी भी मूल्य में addAlpha सेट करके ऐसा कर सकते हैं। जब इनपुट एक गैर-पारदर्शी रंग होता है, तो अल्फा मान जोड़ा जाएगा। यदि यह एक पारदर्शी है, तो प्रदत्त मान इनपुट के अल्फा घटक को ओवरराइट करेगा।

$.rgbGenerator("hsl(0,100%,50%)", {addAlpha: 0.4})
// Will return rgba(255,0,0,0.4)
$.rgbGenerator("hsla(0,100%,50%,0.8)", {addAlpha: 0.4})
// Will return rgba(255,0,0,0.4)

अंत में आरजीबी (ए) रंग को ऑब्जेक्ट के रूप में आउटपुट करना भी संभव है। इसमें आर, जी, बी और वैकल्पिक रूप से एक होगा।

$.rgbGenerator("hsla(0,100%,50%,0.8)", {asObject: true})
/* Will return
{
  "r": 255,
  "g": 0,
  "b": 0,
  "a": 0.8
}
*/
$.rgbGenerator("hsla(0,100%,50%,0.8)", {asObject: true}).r
// Will return 255

यह कोड #fff और #ffffff प्रकारों और अस्पष्टता को स्वीकार करता है।

function hex2rgb(hex, opacity) {
        var h=hex.replace('#', '');
        h =  h.match(new RegExp('(.{'+h.length/3+'})', 'g'));

        for(var i=0; i<h.length; i++)
            h[i] = parseInt(h[i].length==1? h[i]+h[i]:h[i], 16);

        if (typeof opacity != 'undefined')  h.push(opacity);

        return 'rgba('+h.join(',')+')';
}

क्या आप इस तरह कुछ के बाद हो सकता है?

function RGB2HTML(red, green, blue)
{
    return '#' + red.toString(16) +
           green.toString(16) +
           blue.toString(16);
}

alert(RGB2HTML(150, 135, 200));

# 9687 सी 8 प्रदर्शित करता है


@ टिम, अपने उत्तर में जोड़ने के लिए (यह एक टिप्पणी में थोड़ा अजीब फिटिंग)।

जैसा कि लिखा गया है, मैंने पाया कि rgbToHex फ़ंक्शन बिंदु के बाद तत्वों के साथ एक स्ट्रिंग देता है और इसके लिए आवश्यक है कि आर, जी, बी मान 0-255 की सीमा के भीतर आते हैं।

मुझे यकीन है कि यह सबसे अधिक स्पष्ट प्रतीत हो सकता है, लेकिन मुझे पता लगाने में दो घंटे लग गए और तब तक मूल विधि को 7 लाइनों पर गुब्बारा लगा दिया गया था इससे पहले कि मुझे एहसास हुआ कि मेरी समस्या कहीं और थी। तो दूसरों को समय और परेशानी बचाने के हित में, मेरा थोड़ा संशोधित कोड है जो पूर्व-आवश्यकताएं जांचता है और स्ट्रिंग के बाहरी बिट्स को ट्रिम करता है।

function rgbToHex(r, g, b) {
    if(r < 0 || r > 255) alert("r is out of bounds; "+r);
    if(g < 0 || g > 255) alert("g is out of bounds; "+g);
    if(b < 0 || b > 255) alert("b is out of bounds; "+b);
    return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1,7);
}

शॉर्टंड संस्करण जो एक स्ट्रिंग स्वीकार करता है:

function rgbToHex(a){
  a=a.replace(/[^\d,]/g,"").split(","); 
  return"#"+((1<<24)+(+a[0]<<16)+(+a[1]<<8)+ +a[2]).toString(16).slice(1)
}

document.write(rgbToHex("rgb(255,255,255)"));

यह जांचने के लिए कि क्या यह पहले से ही हेक्साडेसिमल नहीं है

function rgbToHex(a){
  if(~a.indexOf("#"))return a;
  a=a.replace(/[^\d,]/g,"").split(","); 
  return"#"+((1<<24)+(+a[0]<<16)+(+a[1]<<8)+ +a[2]).toString(16).slice(1)
}

document.write("rgb: "+rgbToHex("rgb(255,255,255)")+ " -- hex: "+rgbToHex("#e2e2e2"));


सीधे jQuery से कनवर्ट करने के लिए आप कोशिश कर सकते हैं:

  function rgbToHex(color) {
    var bg = color.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    function hex(x) {
      return ("0" + parseInt(x).toString(16)).slice(-2);
    }
    return     "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]);
  }

  rgbToHex($('.col-tab-bar .col-tab span').css('color'))

विधि या फ़ंक्शन: toLowerCase (), ToUpperCase ()

विवरण: इन तरीकों का उपयोग निम्न मामले से ऊपरी मामले या इसके विपरीत से स्ट्रिंग या वर्णमाला को कवर करने के लिए किया जाता है। उदाहरण: "और" से "और"।

अपर केस में कनवर्ट करना: - उदाहरण कोड: -

<script language=javascript>
var ss = " testing case conversion method ";
var result = ss.toUpperCase();
document.write(result);
</script>

परिणाम: परीक्षण मामले रूपांतरण विधि

लोअर केस में कनवर्ट करना: - उदाहरण कोड:

<script language=javascript>
var ss = " TESTING LOWERCASE CONVERT FUNCTION ";
var result = ss.toLowerCase();
document.write(result);
</script>

परिणाम: लोअरकेस कन्वर्ट फ़ंक्शन का परीक्षण करना

स्पष्टीकरण: उपर्युक्त उदाहरणों में,

toUpperCase() method converts any string to "UPPER" case letters.
toLowerCase() method converts any string to "lower" case letters.






javascript colors hex rgb