Funzione Javascript per convertire i nomi dei colors in codici esadecimali

Esiste una funzione integrata che converte un colore per nome nella sua rappresentazione esadecimale? Come se volessi passare “bianco” e ricevere “#FFFFFF”. Voglio davvero evitare di scrivere centinaia se fossi io 🙂

No, ma usando l’ elenco qui puoi crearne uno. Qualcosa come questo:

function colourNameToHex(colour) { var colours = {"aliceblue":"#f0f8ff","antiquewhite":"#faebd7","aqua":"#00ffff","aquamarine":"#7fffd4","azure":"#f0ffff", "beige":"#f5f5dc","bisque":"#ffe4c4","black":"#000000","blanchedalmond":"#ffebcd","blue":"#0000ff","blueviolet":"#8a2be2","brown":"#a52a2a","burlywood":"#deb887", "cadetblue":"#5f9ea0","chartreuse":"#7fff00","chocolate":"#d2691e","coral":"#ff7f50","cornflowerblue":"#6495ed","cornsilk":"#fff8dc","crimson":"#dc143c","cyan":"#00ffff", "darkblue":"#00008b","darkcyan":"#008b8b","darkgoldenrod":"#b8860b","darkgray":"#a9a9a9","darkgreen":"#006400","darkkhaki":"#bdb76b","darkmagenta":"#8b008b","darkolivegreen":"#556b2f", "darkorange":"#ff8c00","darkorchid":"#9932cc","darkred":"#8b0000","darksalmon":"#e9967a","darkseagreen":"#8fbc8f","darkslateblue":"#483d8b","darkslategray":"#2f4f4f","darkturquoise":"#00ced1", "darkviolet":"#9400d3","deeppink":"#ff1493","deepskyblue":"#00bfff","dimgray":"#696969","dodgerblue":"#1e90ff", "firebrick":"#b22222","floralwhite":"#fffaf0","forestgreen":"#228b22","fuchsia":"#ff00ff", "gainsboro":"#dcdcdc","ghostwhite":"#f8f8ff","gold":"#ffd700","goldenrod":"#daa520","gray":"#808080","green":"#008000","greenyellow":"#adff2f", "honeydew":"#f0fff0","hotpink":"#ff69b4", "indianred ":"#cd5c5c","indigo":"#4b0082","ivory":"#fffff0","khaki":"#f0e68c", "lavender":"#e6e6fa","lavenderblush":"#fff0f5","lawngreen":"#7cfc00","lemonchiffon":"#fffacd","lightblue":"#add8e6","lightcoral":"#f08080","lightcyan":"#e0ffff","lightgoldenrodyellow":"#fafad2", "lightgrey":"#d3d3d3","lightgreen":"#90ee90","lightpink":"#ffb6c1","lightsalmon":"#ffa07a","lightseagreen":"#20b2aa","lightskyblue":"#87cefa","lightslategray":"#778899","lightsteelblue":"#b0c4de", "lightyellow":"#ffffe0","lime":"#00ff00","limegreen":"#32cd32","linen":"#faf0e6", "magenta":"#ff00ff","maroon":"#800000","mediumaquamarine":"#66cdaa","mediumblue":"#0000cd","mediumorchid":"#ba55d3","mediumpurple":"#9370d8","mediumseagreen":"#3cb371","mediumslateblue":"#7b68ee", "mediumspringgreen":"#00fa9a","mediumturquoise":"#48d1cc","mediumvioletred":"#c71585","midnightblue":"#191970","mintcream":"#f5fffa","mistyrose":"#ffe4e1","moccasin":"#ffe4b5", "navajowhite":"#ffdead","navy":"#000080", "oldlace":"#fdf5e6","olive":"#808000","olivedrab":"#6b8e23","orange":"#ffa500","orangered":"#ff4500","orchid":"#da70d6", "palegoldenrod":"#eee8aa","palegreen":"#98fb98","paleturquoise":"#afeeee","palevioletred":"#d87093","papayawhip":"#ffefd5","peachpuff":"#ffdab9","peru":"#cd853f","pink":"#ffc0cb","plum":"#dda0dd","powderblue":"#b0e0e6","purple":"#800080", "rebeccapurple":"#663399","red":"#ff0000","rosybrown":"#bc8f8f","royalblue":"#4169e1", "saddlebrown":"#8b4513","salmon":"#fa8072","sandybrown":"#f4a460","seagreen":"#2e8b57","seashell":"#fff5ee","sienna":"#a0522d","silver":"#c0c0c0","skyblue":"#87ceeb","slateblue":"#6a5acd","slategray":"#708090","snow":"#fffafa","springgreen":"#00ff7f","steelblue":"#4682b4", "tan":"#d2b48c","teal":"#008080","thistle":"#d8bfd8","tomato":"#ff6347","turquoise":"#40e0d0", "violet":"#ee82ee", "wheat":"#f5deb3","white":"#ffffff","whitesmoke":"#f5f5f5", "yellow":"#ffff00","yellowgreen":"#9acd32"}; if (typeof colours[colour.toLowerCase()] != 'undefined') return colours[colour.toLowerCase()]; return false; } 

Questo ti darà in RGB – dovresti essere in grado di fare la conversione esadecimale abbastanza facilmente.

 d = document.createElement("div"); d.style.color = "white"; document.body.appendChild(d) //Color in RGB window.getComputedStyle(d).color 

Lo stile Computed non è supportato su tutti i browser.

Edit: Ho ripulito un po ‘questo aspetto e ne ho fatto una sintesi e una dimostrazione . L’approccio di base rimane lo stesso.

L’approccio “aggiungi un elemento al DOM e controlla il suo ComputedStyle” mi sembra un po ‘complesso – devi aggiungerlo e controllarlo e ricordati di rimuoverlo e stai cambiando il DOM solo per calcolare un colore e questo causa reflow? Quindi ecco una soluzione basata su un temporaneo (e mai reso):

 function colorToRGBA(color) { // Returns the color as an array of [r, g, b, a] -- all range from 0 - 255 // color must be a valid canvas fillStyle. This will cover most anything // you'd want to use. // Examples: // colorToRGBA('red') # [255, 0, 0, 255] // colorToRGBA('#f00') # [255, 0, 0, 255] var cvs, ctx; cvs = document.createElement('canvas'); cvs.height = 1; cvs.width = 1; ctx = cvs.getContext('2d'); ctx.fillStyle = color; ctx.fillRect(0, 0, 1, 1); return ctx.getImageData(0, 0, 1, 1).data; } function byteToHex(num) { // Turns a number (0-255) into a 2-character hex number (00-ff) return ('0'+num.toString(16)).slice(-2); } function colorToHex(color) { // Convert any CSS color to a hex representation // Examples: // colorToHex('red') # '#ff0000' // colorToHex('rgb(255, 0, 0)') # '#ff0000' var rgba, hex; rgba = colorToRGBA(color); hex = [0,1,2].map( function(idx) { return byteToHex(rgba[idx]); } ).join(''); return "#"+hex; } 

Nota che questo ti permette di usare qualsiasi cosa che sia un fillStyle di canvas valido, quindi se vuoi scucire un pattern da 1 pixel da un’immagine, ti dirà anche il colore di quello.

Ho provato questo in versioni ragionevolmente moderne di IE, Chrome, Safari e Firefox.

Qui funziona dove usi il browser per calcolarlo per te

 function getHexColor(colorStr) { var a = document.createElement('div'); a.style.color = colorStr; var colors = window.getComputedStyle( document.body.appendChild(a) ).color.match(/\d+/g).map(function(a){ return parseInt(a,10); }); document.body.removeChild(a); return (colors.length >= 3) ? '#' + (((1 << 24) + (colors[0] << 16) + (colors[1] << 8) + colors[2]).toString(16).substr(1)) : false; } getHexColor('teal') // returns #008080 

Spiegazione per riga:

  • Crea elemento html
  • Imposta il colore
  • Ottieni il codice rgb dall'elemento appena aggiunto al corpo (quindi renderizzato), filtra i numeri e converti ciascun numero in un numero intero.
  • Rimuovi l'elemento html appena creato
  • Restituisci il codice esadecimale usando il codice zyklus (vedi i crediti per maggiori informazioni)

crediti per zyklus per il suo codice rgb in hex

Ecco una soluzione per tutti gli scopi che fa esattamente quello che vuoi in ogni browser che è al 100% programmatico, addio tabella statica gigante di nomi e valori esadecimali !:

 // Here is the solution tied together as a native String native extension using // MooTools, though you can implement the same thing in whatever framework you prefer: (function(String){ var valueMatch = { 'rgb(0,0,0)': { 'black': ' ', 'rgb(0,0,0)': ' ' }, 'rgba(0,0,0,0)': { 'transparent': ' ', 'rgba(0,0,0,0)': ' ' }, '#ffffff': { 'transparent': ' ' }, 'transparent': { 'transparent': ' ' } }, colorFromProbe = function(color){ color = color.toString(); if(!color.match(/^#.+$|^[^0-9]+$/)) return color; var probe = ($('moo_color_probe') || new Element('textarea', { 'id': 'moo_color_probe', 'styles': { 'display': 'none', 'color': 'transparent' } }).inject(document.body, 'after')); try{ probe.setStyle('color', color) } catch(e){ return color } //IE throws an error instead of defaulting the style to some color or transparent when the value is unrecognized var computed = (Browser.ie) ? ieColorToHex(probe) : (Browser.opera) ? probe.style.color : probe.getComputedStyle('color'), match = valueMatch[computed.replace(/ /g, '')]; probe.setStyle('color', 'transparent'); if((!Browser.ie || Browser.ie9) && color == 'transparent' && (match && match['transparent'])) return 'rgba(0, 0, 0, 0)'; return (computed == 'transparent' || match && !match[color.replace(/ /g, '')]) ? color : computed; }, ieColorToHex = function(probe){ // Special IE mojo, thanks to Dean Edwards for the inspiration, his code used a pop-up window to test the color, I found you can simply use a textarea instead ;) var value = probe.set('value', '').createTextRange().queryCommandValue("ForeColor"); value = (((value & 0x0000ff) << 16) | (value & 0x00ff00) | ((value & 0xff0000) >>> 16)).toString(16); return "#000000".slice(0, 7 - value.length) + value; }; String.implement({ colorToRgb: function(){ var color = colorFromProbe(this); return (color.charAt(0) == '#') ? color.hexToRgb() : color; }, colorToHex: function(){ var color = colorFromProbe(this); return (color.test('rgb')) ? color.rgbToHex() : color; } }); })(String); 

Una spiegazione più completa e un esempio dal vivo possono essere trovati qui: http://www.backalleycoder.com/2010/10/05/converting-css-named-colors-to-rgb-and-hex/

Dovrai fare affidamento su getComputedStyle(...) .

Esempio di utilizzo di getComputedStyle :

 function convertToHexColor(englishColor) { // create a temporary div. var div = $('
').appendTo("body").css('background-color', englishColor); var computedStyle = window.getComputedStyle(div[0]); // get computed color. var computedColor = computedStyle.backgroundColor; // cleanup temporary div. div.remove(); // done. return computedColor; // The above returns "rgb(R, G, B)" on IE9/Chrome20/Firefox13. };

E per convertire “rgb (R, G, B)” in #RRGGBB puoi usare:

 function convertRGBDecimalToHex(rgb) { var regex = /rgb *\( *([0-9]{1,3}) *, *([0-9]{1,3}) *, *([0-9]{1,3}) *\)/; var values = regex.exec(rgb); if(values.length != 4) { return rgb; // fall back to what was given. } var r = Math.round(parseFloat(values[1])); var g = Math.round(parseFloat(values[2])); var b = Math.round(parseFloat(values[3])); return "#" + (r + 0x10000).toString(16).substring(3).toUpperCase() + (g + 0x10000).toString(16).substring(3).toUpperCase() + (b + 0x10000).toString(16).substring(3).toUpperCase(); } 

@ dlauzon mi ha suggerito di convertire il mio commento in una risposta. Grazie per il suggerimento! Ecco qui 🙂

 function standardize_color(str){ var ctx = document.createElement(&#39;canvas&#39;).getContext(‌​'2d'​); ctx.fillStyle = str; return ctx.fillStyle; } 

basandosi sulla risposta di Greg inclusa la versione grigio / grigio

aggiunto: flag per passare attraverso stringhe non risolte

disponibile come gist colorhelpersforcanvas.js

 String.prototype.colorNameToHex = function (returnUnresolved) { // color list from https://stackoverflow.com/q/1573053/731179 with added gray/gray var hexRGB, definedColorNames = {"aliceblue": "#f0f8ff", "antiquewhite": "#faebd7", "aqua": "#00ffff", "aquamarine": "#7fffd4", "azure": "#f0ffff", "beige": "#f5f5dc", "bisque": "#ffe4c4", "black": "#000000", "blanchedalmond": "#ffebcd", "blue": "#0000ff", "blueviolet": "#8a2be2", "brown": "#a52a2a", "burlywood": "#deb887", "cadetblue": "#5f9ea0", "chartreuse": "#7fff00", "chocolate": "#d2691e", "coral": "#ff7f50", "cornflowerblue": "#6495ed", "cornsilk": "#fff8dc", "crimson": "#dc143c", "cyan": "#00ffff", "darkblue": "#00008b", "darkcyan": "#008b8b", "darkgoldenrod": "#b8860b", "darkgray": "#a9a9a9", "darkgreen": "#006400", "darkkhaki": "#bdb76b", "darkmagenta": "#8b008b", "darkolivegreen": "#556b2f", "darkorange": "#ff8c00", "darkorchid": "#9932cc", "darkred": "#8b0000", "darksalmon": "#e9967a", "darkseagreen": "#8fbc8f", "darkslateblue": "#483d8b", "darkslategray": "#2f4f4f", "darkturquoise": "#00ced1", "darkviolet": "#9400d3", "deeppink": "#ff1493", "deepskyblue": "#00bfff", "dimgray": "#696969", "dodgerblue": "#1e90ff", "firebrick": "#b22222", "floralwhite": "#fffaf0", "forestgreen": "#228b22", "fuchsia": "#ff00ff", "gainsboro": "#dcdcdc", "ghostwhite": "#f8f8ff", "gold": "#ffd700", "goldenrod": "#daa520", "gray": "#808080", "green": "#008000", "greenyellow": "#adff2f", "honeydew": "#f0fff0", "hotpink": "#ff69b4", "indianred ": "#cd5c5c", "indigo ": "#4b0082", "ivory": "#fffff0", "khaki": "#f0e68c", "lavender": "#e6e6fa", "lavenderblush": "#fff0f5", "lawngreen": "#7cfc00", "lemonchiffon": "#fffacd", "lightblue": "#add8e6", "lightcoral": "#f08080", "lightcyan": "#e0ffff", "lightgoldenrodyellow": "#fafad2", "lightgrey": "#d3d3d3", "lightgreen": "#90ee90", "lightpink": "#ffb6c1", "lightsalmon": "#ffa07a", "lightseagreen": "#20b2aa", "lightskyblue": "#87cefa", "lightslategray": "#778899", "lightsteelblue": "#b0c4de", "lightyellow": "#ffffe0", "lime": "#00ff00", "limegreen": "#32cd32", "linen": "#faf0e6", "magenta": "#ff00ff", "maroon": "#800000", "mediumaquamarine": "#66cdaa", "mediumblue": "#0000cd", "mediumorchid": "#ba55d3", "mediumpurple": "#9370d8", "mediumseagreen": "#3cb371", "mediumslateblue": "#7b68ee", "mediumspringgreen": "#00fa9a", "mediumturquoise": "#48d1cc", "mediumvioletred": "#c71585", "midnightblue": "#191970", "mintcream": "#f5fffa", "mistyrose": "#ffe4e1", "moccasin": "#ffe4b5", "navajowhite": "#ffdead", "navy": "#000080", "oldlace": "#fdf5e6", "olive": "#808000", "olivedrab": "#6b8e23", "orange": "#ffa500", "orangered": "#ff4500", "orchid": "#da70d6", "palegoldenrod": "#eee8aa", "palegreen": "#98fb98", "paleturquoise": "#afeeee", "palevioletred": "#d87093", "papayawhip": "#ffefd5", "peachpuff": "#ffdab9", "peru": "#cd853f", "pink": "#ffc0cb", "plum": "#dda0dd", "powderblue": "#b0e0e6", "purple": "#800080", "red": "#ff0000", "rosybrown": "#bc8f8f", "royalblue": "#4169e1", "saddlebrown": "#8b4513", "salmon": "#fa8072", "sandybrown": "#f4a460", "seagreen": "#2e8b57", "seashell": "#fff5ee", "sienna": "#a0522d", "silver": "#c0c0c0", "skyblue": "#87ceeb", "slateblue": "#6a5acd", "slategray": "#708090", "snow": "#fffafa", "springgreen": "#00ff7f", "steelblue": "#4682b4", "tan": "#d2b48c", "teal": "#008080", "thistle": "#d8bfd8", "tomato": "#ff6347", "turquoise": "#40e0d0", "violet": "#ee82ee", "wheat": "#f5deb3", "white": "#ffffff", "whitesmoke": "#f5f5f5", "yellow": "#ffff00", "yellowgreen": "#9acd32", "darkgrey": "#a9a9a9", "darkslategrey": "#2f4f4f", "dimgrey": "#696969", "grey": "#808080", "lightgray": "#d3d3d3", "lightslategrey": "#778899", "slategrey": "#708090"}; if (definedColorNames[this.toLowerCase()] !== undefined) { hexRGB = definedColorNames[this.toLowerCase()]; // to keep unresolved strings set flag returnUnresolved to true } else {if (returnUnresolved) {hexRGB = this; } else {hexRGB = undefined; } } return hexRGB; }; 

alcuni casi di test:

 console.log("black".colorNameToHex()); //returns #000000 console.log("rgba(100,100,0,0.7)".colorNameToHex()); //returns undefined console.log("rgba(100,100,0,0.7)".colorNameToHex(1)); //returns rgba(100,100,0,0.7) 

come bonus qui il mio caso d’uso per quello in una conversione da stringa di colore a color-string-with-alpha:

funziona con qualsiasi colore definito css tra cui: rgba, rgb, r% g% b%, #rgb, #rrggbb, hsl, hsla

utile soprattutto nel disegno con alfa / opacità / trasparenza su un elemento canvas HTML5 con stringhe di colore passate

 String.prototype.setAlpha = function (alpha) { // change alpha of color string in any css color space // intended for use in canvas/svg // currently implemented: // css defined colors > rgba // rgba, rgb, r%g%b%, #rgb, #rrggbb > rgba // hsl, hsla > hsla // unresolved > as is // // If no alpha is passed its is set to 1 or keeps the value in rgba/hsla // kill whitespace split at "(", ")", "," var i, hex, c = this.replace(/\s/g, '').split(/[\(\),]/); function extractHex(string) { if (string.charAt(0) === "#") { // detect hex strings hex = string.replace(/#/g, ''); string = "hex"; } else {hex = undefined; } return string; } extractHex(c[0]); if (["rgba", "rgb", "hsla", "hsl", "hex"].indexOf(c[0]) === -1) { c[0] = extractHex(c[0].colorNameToHex(1)); // detect defined color names } switch (c[0]) { case "rgba": if (alpha === undefined) {alpha = c[4]; } c = "rgba(" + c[1] + ", " + c[2] + ", " + c[3] + ", " + alpha + ")"; break; case "rgb": if (alpha === undefined) {alpha = 1; } // if colors are in percentage values for (i = 1; i <= 3; i = i + 1) { if (c[i].charAt(c[i].length - 1) === "%") { c[i] = Math.round(c[i].replace(/%/g, '') * 2.55); } } c = "rgba(" + c[1] + ", " + c[2] + ", " + c[3] + ", " + alpha + ")"; break; case "hsl": if (alpha === undefined) {alpha = 1; } c = "hsla(" + c[1] + ", " + c[2] + ", " + c[3] + ", " + alpha + ")"; break; case "hsla": if (alpha === undefined) {alpha = c[4]; } c = "hsla(" + c[1] + ", " + c[2] + ", " + c[3] + ", " + alpha + ")"; break; case "hex": if (alpha === undefined) {alpha = 1; } if (hex.length === 3) { c[1] = parseInt(hex.charAt(0) + hex.charAt(0), 16); c[2] = parseInt(hex.charAt(1) + hex.charAt(1), 16); c[3] = parseInt(hex.charAt(2) + hex.charAt(2), 16); } else if (hex.length === 6) { c[1] = parseInt(hex.charAt(0) + hex.charAt(1), 16); c[2] = parseInt(hex.charAt(2) + hex.charAt(3), 16); c[3] = parseInt(hex.charAt(4) + hex.charAt(5), 16); } else {break; } c = "rgba(" + c[1] + ", " + c[2] + ", " + c[3] + ", " + alpha + ")"; break; default: c = this; break; } return c; }; 

test:

 console.log("orange".setAlpha(0.3)); 

Non è integrato, per quanto ne so. Sarebbe una specie di trucco, ma penso che potresti creare un div invisibile, impostare la sua proprietà di sfondo CSS sul colore indicato, quindi usare JS per ottenere il colore di sfondo del div, quindi eliminare il div.

IE8 getComputedStyle polyfill se necessario

 var rgbToHex = function(r, g, b) { return "#" + (16777216 | b | (g << 8) | (r << 16)).toString(16).slice(1); }; var d = document.createElement('div'); d.style.color = 'white'; window.document.body.appendChild(d); var parts = (window.getComputedStyle(d).color || '').match(/\d+/g); var f = function(n) { return parseInt(n, 10); }; window.document.body.removeChild(d); var hex = rgbToHex(f(parts[0]), f(parts[1]), f(parts[2])); //"#ffffff" 

Il codice rapido solo per i valori HEX / RGB, potrebbe essere utile a qualcuno e può essere adattato per includere i nomi: trascina l’intero object nel ciclo for, controlla il nome e se corrisponde corrisponde al tuo hex / rbg. Sono presi da qui: http://www.colourlovers.com/web/blog/2008/04/22/all-120-crayon-names-color-codes-and-fun-facts

Soprattutto, si prega di notare l’ortografia corretta di “colore”: P

 /*COLOURS*/ function loadColourPalette() { $("#colourPalette").empty(); //load them animated for (var t = 0; t<120; t++){ var c = returnColourForIndex(t); console.log("c is " + c); var div = '
'; $("#colourPalette").append(div); } } function returnColourForIndex(i){ var colours = [ {hex:"CD4A4A",rgb:"205,74,74"}, {hex:"CC6666",rgb:"204,102,102"}, {hex:"BC5D58",rgb:"188,93,88"}, {hex:"FF5349",rgb:"255,83,73"}, {hex:"FD5E53",rgb:"253,94,83"}, {hex:"FD7C6E",rgb:"253,124,110"}, {hex:"FDBCB4",rgb:"253,188,180"}, {hex:"FF6E4A",rgb:"255,110,74"}, {hex:"FFA089",rgb:"255,160,137"}, {hex:"EA7E5D",rgb:"234,126,93"}, {hex:"B4674D",rgb:"180,103,77"}, {hex:"A5694F",rgb:"165,105,79"}, {hex:"FF7538",rgb:"255,117,56"}, {hex:"FF7F49",rgb:"255,127,73"}, {hex:"DD9475",rgb:"221,148,117"}, {hex:"FF8243",rgb:"255,130,67"}, {hex:"FFA474",rgb:"255,164,116"}, {hex:"9F8170",rgb:"159,129,112"}, {hex:"CD9575",rgb:"205,149,117"}, {hex:"EFCDB8",rgb:"239,205,184"}, {hex:"D68A59",rgb:"214,138,89"}, {hex:"DEAA88",rgb:"222,170,136"}, {hex:"FAA76C",rgb:"250,167,108"}, {hex:"FFCFAB",rgb:"255,207,171"}, {hex:"FFBD88",rgb:"255,189,136"}, {hex:"FDD9B5",rgb:"253,217,181"}, {hex:"FFA343",rgb:"255,163,67"}, {hex:"EFDBC5",rgb:"239,219,197"}, {hex:"FFB653",rgb:"255,182,83"}, {hex:"E7C697",rgb:"231,198,151"}, {hex:"8A795D",rgb:"138,121,93"}, {hex:"FAE7B5",rgb:"250,231,181"}, {hex:"FFCF48",rgb:"255,207,72"}, {hex:"FCD975",rgb:"252,217,117"}, {hex:"FDDB6D",rgb:"253,219,109"}, {hex:"FCE883",rgb:"252,232,131"}, {hex:"F0E891",rgb:"240,232,145"}, {hex:"ECEABE",rgb:"236,234,190"}, {hex:"BAB86C",rgb:"186,184,108"}, {hex:"FDFC74",rgb:"253,252,116"}, {hex:"FFFF99",rgb:"255,255,153"}, {hex:"C5E384",rgb:"197,227,132"}, {hex:"B2EC5D",rgb:"178,236,93"}, {hex:"87A96B",rgb:"135,169,107"}, {hex:"A8E4A0",rgb:"168,228,160"}, {hex:"1DF914",rgb:"29,249,20"}, {hex:"76FF7A",rgb:"118,255,122"}, {hex:"71BC78",rgb:"113,188,120"}, {hex:"6DAE81",rgb:"109,174,129"}, {hex:"9FE2BF",rgb:"159,226,191"}, {hex:"1CAC78",rgb:"28,172,120"}, {hex:"30BA8F",rgb:"48,186,143"}, {hex:"45CEA2",rgb:"69,206,162"}, {hex:"3BB08F",rgb:"59,176,143"}, {hex:"1CD3A2",rgb:"28,211,162"}, {hex:"17806D",rgb:"23,128,109"}, {hex:"158078",rgb:"21,128,120"}, {hex:"1FCECB",rgb:"31,206,203"}, {hex:"78DBE2",rgb:"120,219,226"}, {hex:"77DDE7",rgb:"119,221,231"}, {hex:"80DAEB",rgb:"128,218,235"}, {hex:"199EBD",rgb:"251,58,189"}, {hex:"1CA9C9",rgb:"28,169,201"}, {hex:"1DACD6",rgb:"291,72,214"}, {hex:"9ACEEB",rgb:"154,206,235"}, {hex:"1A4876",rgb:"26,72,118"}, {hex:"1974D2",rgb:"25,116,210"}, {hex:"2B6CC4",rgb:"43,108,196"}, {hex:"1F75FE",rgb:"31,117,254"}, {hex:"C5D0E6",rgb:"197,208,230"}, {hex:"B0B7C6",rgb:"176,183,198"}, {hex:"5D76CB",rgb:"93,118,203"}, {hex:"A2ADD0",rgb:"162,173,208"}, {hex:"979AAA",rgb:"151,154,170"}, {hex:"ADADD6",rgb:"173,173,214"}, {hex:"7366BD",rgb:"115,102,189"}, {hex:"7442C8",rgb:"116,66,200"}, {hex:"7851A9",rgb:"120,81,169"}, {hex:"9D81BA",rgb:"157,129,186"}, {hex:"926EAE",rgb:"146,110,174"}, {hex:"CDA4DE",rgb:"205,164,222"}, {hex:"8F509D",rgb:"143,80,157"}, {hex:"C364C5",rgb:"195,100,197"}, {hex:"FB7EFD",rgb:"251,126,253"}, {hex:"FC74FD",rgb:"252,116,253"}, {hex:"8E4585",rgb:"142,69,133"}, {hex:"FF1DCE",rgb:"255,29,206"}, {hex:"FF48D0",rgb:"255,72,208"}, {hex:"E6A8D7",rgb:"230,168,215"}, {hex:"C0448F",rgb:"192,68,143"}, {hex:"6E5160",rgb:"110,81,96"}, {hex:"DD4492",rgb:"221,68,146"}, {hex:"FF43A4",rgb:"255,67,164"}, {hex:"F664AF",rgb:"246,100,175"}, {hex:"FCB4D5",rgb:"252,180,213"}, {hex:"FFBCD9",rgb:"255,188,217"}, {hex:"F75394",rgb:"247,83,148"}, {hex:"FFAACC",rgb:"255,170,204"}, {hex:"E3256B",rgb:"227,37,107"}, {hex:"FDD7E4",rgb:"253,215,228"}, {hex:"CA3767",rgb:"202,55,103"}, {hex:"DE5D83",rgb:"222,93,131"}, {hex:"FC89AC",rgb:"252,137,172"}, {hex:"F780A1",rgb:"247,128,161"}, {hex:"C8385A",rgb:"200,56,90"}, {hex:"EE204D",rgb:"238,32,77"}, {hex:"FF496C",rgb:"255,73,108"}, {hex:"EF98AA",rgb:"239,152,170"}, {hex:"FC6C85",rgb:"252,108,133"}, {hex:"FC2847",rgb:"252,40,71"}, {hex:"FF9BAA",rgb:"255,155,170"}, {hex:"CB4154",rgb:"203,65,84"}, {hex:"FFFFFF",rgb:"255,255,255"}, {hex:"EDEDED",rgb:"237,237,237"}, {hex:"DBD7D2",rgb:"219,215,210"}, {hex:"CDC5C2",rgb:"205,197,194"}, {hex:"95918C",rgb:"149,145,140"}, {hex:"414A4C",rgb:"65,74,76"}, {hex:"232323",rgb:"35,35,35"}, {hex:"000000",rgb:"0,0,0"}]; return "#"+colours[i].hex; }