#12B5E2 - #006AA6 | colorate

colorate es una herramienta de esquema de color para diseñadores y desarrolladores. Esta ayudará a inspirarse y servirá de recurso para su trabajo de color. Haz que este sitio sea mejor

Mezcla #12B5E2 a #006AA6

#12B5E2 #006AA6

Calcule el color entre dos colores, #12B5E2 y #006AA6. En el cálculo de los valores RGB, la saturación entre los colores diferentes es baja. Al calcular los valores de HSV, la saturación entre los diferentes colores no es baja.

Mezcla RGB (Linear)

#12B5E2 - #006AA6 | colorate

Cálculo del color entre dos colores según el valor RGB. Para colores que están distantes entre sí, la saturación entre los dos colores disminuye. Expande el color entre dos colores con #12B5E2 como 0% y #006AA6 como 100%.

0.0%	0.0% #12B5E2	RGB 18 181 226	#12B5E2
16.7%	16.7% #0FA8D8	RGB 15 168 216	#0FA8D8
33.3%	33.3% #0C9CCE	RGB 12 156 206	#0C9CCE
50.0%	50.0% #098FC4	RGB 9 143 196	#098FC4
66.7%	66.7% #0683BA	RGB 6 131 186	#0683BA
83.3%	83.3% #0376B0	RGB 3 118 176	#0376B0
100.0%	100.0% #006AA6	RGB 0 106 166	#006AA6

#12B5E2 #0FA8D8 #0C9CCE #098FC4 #0683BA #0376B0 #006AA6

#12B5E2 - #006AA6

Mezcla HSV

#12B5E2 - #006AA6 | colorate

Cálculo del color entre dos colores según el valor de HSV. Incluso entre distintos colores de color, la saturación entre los dos colores no disminuye. Expande el color entre dos colores con #12B5E2 como 0% y #006AA6 como 100%.

0.0%	0.0% #11B4E2	RGB 17 180 226	#11B4E2
16.7%	16.7% #0EA7D8	RGB 14 167 216	#0EA7D8
33.3%	33.3% #0A9ACE	RGB 10 154 206	#0A9ACE
50.0%	50.0% #078DC4	RGB 7 141 196	#078DC4
66.7%	66.7% #0481BA	RGB 4 129 186	#0481BA
83.3%	83.3% #0275B0	RGB 2 117 176	#0275B0
100.0%	100.0% #006AA6	RGB 0 106 166	#006AA6

#11B4E2 #0EA7D8 #0A9ACE #078DC4 #0481BA #0275B0 #006AA6

#12B5E2 - #078DC4 - #006AA6

Códigos CSS

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #12B5E2 0%, #006AA6 100%);
    background: -webkit-linear-gradient(top, #12B5E2 0%, #006AA6 100%);
    background: linear-gradient(to bottom, #12B5E2 0%, #006AA6 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #11B4E2 0%, #078DC4 50%, #006AA6 100%);
    background: -webkit-linear-gradient(top, #11B4E2 0%, #078DC4 50%, #006AA6 100%);
    background: linear-gradient(to bottom, #11B4E2 0%, #078DC4 50%, #006AA6 100%);
}
</style>