#0060A6 - #B6D0E5 | 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 #0060A6 a #B6D0E5

#0060A6 #B6D0E5

Calcule el color entre dos colores, #0060A6 y #B6D0E5. 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)

#0060A6 - #B6D0E5 | 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 #0060A6 como 0% y #B6D0E5 como 100%.

0.0%	0.0% #0060A6	RGB 0 96 166	#0060A6
16.7%	16.7% #1E72B0	RGB 30 114 176	#1E72B0
33.3%	33.3% #3C85BB	RGB 60 133 187	#3C85BB
50.0%	50.0% #5B98C5	RGB 91 152 197	#5B98C5
66.7%	66.7% #79AAD0	RGB 121 170 208	#79AAD0
83.3%	83.3% #97BDDA	RGB 151 189 218	#97BDDA
100.0%	100.0% #B6D0E5	RGB 182 208 229	#B6D0E5

#0060A6 #1E72B0 #3C85BB #5B98C5 #79AAD0 #97BDDA #B6D0E5

#0060A6 - #B6D0E5

Mezcla HSV

#0060A6 - #B6D0E5 | 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 #0060A6 como 0% y #B6D0E5 como 100%.

0.0%	0.0% #0060A6	RGB 0 96 166	#0060A6
16.7%	16.7% #176FB0	RGB 23 111 176	#176FB0
33.3%	33.3% #317FBB	RGB 49 127 187	#317FBB
50.0%	50.0% #4E91C5	RGB 78 145 197	#4E91C5
66.7%	66.7% #6EA5D0	RGB 110 165 208	#6EA5D0
83.3%	83.3% #90B9DA	RGB 144 185 218	#90B9DA
100.0%	100.0% #B6D0E5	RGB 182 208 229	#B6D0E5

#0060A6 #176FB0 #317FBB #4E91C5 #6EA5D0 #90B9DA #B6D0E5

#0060A6 - #4E91C5 - #B6D0E5

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0060A6 0%, #4E91C5 50%, #B6D0E5 100%);
    background: -webkit-linear-gradient(top, #0060A6 0%, #4E91C5 50%, #B6D0E5 100%);
    background: linear-gradient(to bottom, #0060A6 0%, #4E91C5 50%, #B6D0E5 100%);
}
</style>