#003B5E - #508FA5 | 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 #003B5E a #508FA5

#003B5E #508FA5

Calcule el color entre dos colores, #003B5E y #508FA5. 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)

#003B5E - #508FA5 | 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 #003B5E como 0% y #508FA5 como 100%.

0.0%	0.0% #003B5E	RGB 0 59 94	#003B5E
16.7%	16.7% #0D4969	RGB 13 73 105	#0D4969
33.3%	33.3% #1A5775	RGB 26 87 117	#1A5775
50.0%	50.0% #286581	RGB 40 101 129	#286581
66.7%	66.7% #35738D	RGB 53 115 141	#35738D
83.3%	83.3% #428199	RGB 66 129 153	#428199
100.0%	100.0% #508FA5	RGB 80 143 165	#508FA5

#003B5E #0D4969 #1A5775 #286581 #35738D #428199 #508FA5

#003B5E - #508FA5

Mezcla HSV

#003B5E - #508FA5 | 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 #003B5E como 0% y #508FA5 como 100%.

0.0%	0.0% #003B5E	RGB 0 59 94	#003B5E
16.7%	16.7% #084769	RGB 8 71 105	#084769
33.3%	33.3% #135475	RGB 19 84 117	#135475
50.0%	50.0% #1F6281	RGB 31 98 129	#1F6281
66.7%	66.7% #2D708D	RGB 45 112 141	#2D708D
83.3%	83.3% #3D7F99	RGB 61 127 153	#3D7F99
100.0%	100.0% #508FA5	RGB 80 143 165	#508FA5

#003B5E #084769 #135475 #1F6281 #2D708D #3D7F99 #508FA5

#003B5E - #1F6281 - #508FA5

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #003B5E 0%, #1F6281 50%, #508FA5 100%);
    background: -webkit-linear-gradient(top, #003B5E 0%, #1F6281 50%, #508FA5 100%);
    background: linear-gradient(to bottom, #003B5E 0%, #1F6281 50%, #508FA5 100%);
}
</style>