colors - online - tabla de codigo de colores

Obscurecer programáticamente un color hexadecimal

Question

¿Cuál es la forma más fácil de oscurecer programáticamente un color hexadecimal?

Answer 1

Bueno, no tengo ningún pseudocódigo para ti, solo un consejo. Si desea oscurecer un color y mantener su tono, debe convertir ese hexágono a HSB (tono, saturación, brillo) en lugar de RGB. De esta manera, puede ajustar el brillo y aún se verá como el mismo color sin cambio de matiz. Luego puedes convertir ese HSB de nuevo a hexadecimal.

Answer 2

Debe considerar oscurecer el color en el espacio de color L * a * b *. Aquí hay un ejemplo en JavaScript usando chroma.js :

chroma.hex("#FCFC00").darker(10).hex()  // "#dde000"

Answer 3

Los colores RGB (en notación RGB hexadecimal) se vuelven más oscuros o más claros ajustando el tono, la clave, la luminosidad o el brillo. Ver el patio de recreo: colorizer.org

Opción 1. Traducir los valores R, G, B para oscurecer la sombra

Este es simple, pero fácil de desordenar. Aquí está restando 16 puntos de la escala (0,255) de cada valor:

myHex = 0x8c36a9;
darkerHex = myHex - 0x101010;
#  0x7c2699;

El hexágono descenderá si cualquiera de los valores R, G, B es 0x0f o inferior. Algo como esto arreglaría eso.

myHex = 0x87f609;
darkenBy = 0x10;
floor = 0x0;

darkerHex = (max((myHex >> 16) - darkenBy, floor) << 16) + /
    (max(((myHex & 0xff00) >> 8) - darkenBy, floor) << 8) + /
    max(((myHex & 0xff) - darkenBy), floor);
# 0x77e600

# substitute `ceiling=0xff;` and `min((myHex ...) + lightenBy, ceiling)` for lightening

Opción 2. Escalar los valores de R, G, B para aumentar el negro

En el modelo CMYK , la clave (negro) es 1 - máx. De los valores R, G, B en la escala (0,1).

Este es lo suficientemente simple como para obtener buenos resultados sin demasiados códigos. Está reescalando la distribución de los valores R, G, B por un único factor de escala.

Exprese el factor de escala como hexadecimal de 2 dígitos (por lo que 50% sería .5*0x100 o 0x80 , 1 / 16th es 0x10 y el 10% se redondea a 0x19 ).

#  Assumes integer division ... looking at you python3 >:(

myHex = 0x8c36a9;
keyFactor = 0x10;                   #  Lighten or darken by 6.25%
R = myHex >> 16;                    #  0x8c
G = (myHex & 0xff00) >> 8;          #  0x36
B = myHex & 0xff;                   #  0xa9

darkerHex = ((R-R*keyFactor/0x100) << 16) +  # Darker R
            ((G-G*keyFactor/0x100) << 8) +   # Darker G
            (B-B*keyFactor/0x100);           # Darker B
#  0x84339f

#  substitute `(X+keyFactor-X*keyFactor/0x100)` for lightening 
#  0x9443af

Opción 3. Reducir la luminosidad o el brillo a un tono constante

En la representación HSL de RGB, la luminosidad es el punto medio entre el mínimo y el máximo de los valores R, G, B. Para HSV , el brillo es el máximo de los valores R, G, B.

Considere utilizar el convertidor de RGB / HEX a HSL / HSV incorporado o externo de su idioma. Luego ajuste sus valores L / V y vuelva a convertir a RGB / HSL. Puede hacer la conversión a mano, como en # 1 y # 2, pero la implementación puede no salvarle en ningún momento sobre un convertidor existente (vea los enlaces para las matemáticas).

Answer 4

Reuní una buena función de dos líneas para esto:

Programmatically Aclarar u oscurecer un color hexadecimal (o rgb, y mezclar colores)

shadeColor2(hexcolor,-0.05) para un 5% más oscuro

shadeColor2(hexcolor,-0.25) para un 25% más oscuro

Use positivos para aclarar.

Answer 5

Si no te preocupa demasiado el control y solo quieres una versión generalmente más oscura de un color, entonces:

col = (col & 0xfefefe) >> 1;

Es una buena forma rápida de reducir a la mitad el valor de un color (asumiendo que está empaquetado como un byte por canal, obviamente).

De la misma manera más brillante sería:

col = (col & 0x7f7f7f) << 1;

Answer 6

Un color hexadecimal como #FCFCFC consta de tres pares que representan RGB. La segunda parte de cada par se puede reducir para oscurecer cualquier color sin alterar considerablemente el color.

p.ej. para oscurecer #FCFCFC, baje los valores de C para dar # F0F0F0

Reducir la primera parte de cada par en una pequeña cantidad también oscurecerá el color, pero comenzarás a afectar más el color (por ejemplo, cambiar de verde a azul).

Answer 7

Una función implementada en javascript:

// credits: richard maloney 2006
function getTintedColor(color, v) {
    if (color.length >6) { color= color.substring(1,color.length)}
    var rgb = parseInt(color, 16); 
    var r = Math.abs(((rgb >> 16) & 0xFF)+v); if (r>255) r=r-(r-255);
    var g = Math.abs(((rgb >> 8) & 0xFF)+v); if (g>255) g=g-(g-255);
    var b = Math.abs((rgb & 0xFF)+v); if (b>255) b=b-(b-255);
    r = Number(r < 0 || isNaN(r)) ? 0 : ((r > 255) ? 255 : r).toString(16); 
    if (r.length == 1) r = ''0'' + r;
    g = Number(g < 0 || isNaN(g)) ? 0 : ((g > 255) ? 255 : g).toString(16); 
    if (g.length == 1) g = ''0'' + g;
    b = Number(b < 0 || isNaN(b)) ? 0 : ((b > 255) ? 255 : b).toString(16); 
    if (b.length == 1) b = ''0'' + b;
    return "#" + r + g + b;
} 

Ejemplo:

> getTintedColor("ABCEDEF", 10)
> #c6f7f9

Answer 8

Convertir el color hexadecimal en componentes RBG enteros:

#FF6600 = rbg(255, 102, 0)

Si desea oscurecerlo un 5%, simplemente reduzca todos los valores enteros en un 5%:

255 - 5% = 242
102 - 5% = 96
0 - 5% = 0

= rbg(242, 96, 0)

Convertir de nuevo a color hexadecimal

= #F26000

Answer 9

given arg darken_factor # a number from 0 to 1, 0=no change, 1=black
for each byte in rgb_value
    byte = byte * (1 - darken_factor)

Answer 10

• Divida el color hexadecimal en sus componentes RGB.
• Convierta cada uno de estos componentes en un valor entero.
• Multiplique ese entero por una fracción, como 0.5 , asegurándose de que el resultado también sea entero.
  • Alternativamente, reste una cantidad establecida de ese entero, asegurándose de no ir por debajo de 0.
• Convierte el resultado a hex.
• Concatenar estos valores en orden RGB y usar.