#3670A8 - #004554 | 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 #3670A8 a #004554

#3670A8 #004554

Calcule el color entre dos colores, #3670A8 y #004554. 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)

#3670A8 - #004554 | 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 #3670A8 como 0% y #004554 como 100%.

0.0%	0.0% #3670A8	RGB 54 112 168	#3670A8
16.7%	16.7% #2D689A	RGB 45 104 154	#2D689A
33.3%	33.3% #24618C	RGB 36 97 140	#24618C
50.0%	50.0% #1B5A7E	RGB 27 90 126	#1B5A7E
66.7%	66.7% #125370	RGB 18 83 112	#125370
83.3%	83.3% #094C62	RGB 9 76 98	#094C62
100.0%	100.0% #004554	RGB 0 69 84	#004554

#3670A8 #2D689A #24618C #1B5A7E #125370 #094C62 #004554

#3670A8 - #004554

Mezcla HSV

#3670A8 - #004554 | 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 #3670A8 como 0% y #004554 como 100%.

0.0%	0.0% #3670A8	RGB 54 112 168	#3670A8
16.7%	16.7% #29689A	RGB 41 104 154	#29689A
33.3%	33.3% #1E618C	RGB 30 97 140	#1E618C
50.0%	50.0% #145A7E	RGB 20 90 126	#145A7E
66.7%	66.7% #0C5370	RGB 12 83 112	#0C5370
83.3%	83.3% #054C62	RGB 5 76 98	#054C62
100.0%	100.0% #004554	RGB 0 69 84	#004554

#3670A8 #29689A #1E618C #145A7E #0C5370 #054C62 #004554

#3670A8 - #145A7E - #004554

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3670A8 0%, #145A7E 50%, #004554 100%);
    background: -webkit-linear-gradient(top, #3670A8 0%, #145A7E 50%, #004554 100%);
    background: linear-gradient(to bottom, #3670A8 0%, #145A7E 50%, #004554 100%);
}
</style>