#3C7F96 - #1F3844 | 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 #3C7F96 a #1F3844

#3C7F96 #1F3844

Calcule el color entre dos colores, #3C7F96 y #1F3844. 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)

#3C7F96 - #1F3844 | 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 #3C7F96 como 0% y #1F3844 como 100%.

0.0%	0.0% #3C7F96	RGB 60 127 150	#3C7F96
16.7%	16.7% #377388	RGB 55 115 136	#377388
33.3%	33.3% #32677A	RGB 50 103 122	#32677A
50.0%	50.0% #2D5B6D	RGB 45 91 109	#2D5B6D
66.7%	66.7% #284F5F	RGB 40 79 95	#284F5F
83.3%	83.3% #234351	RGB 35 67 81	#234351
100.0%	100.0% #1F3844	RGB 31 56 68	#1F3844

#3C7F96 #377388 #32677A #2D5B6D #284F5F #234351 #1F3844

#3C7F96 - #1F3844

Mezcla HSV

#3C7F96 - #1F3844 | 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 #3C7F96 como 0% y #1F3844 como 100%.

0.0%	0.0% #3C7F96	RGB 60 127 150	#3C7F96
16.7%	16.7% #377288	RGB 55 114 136	#377288
33.3%	33.3% #33667A	RGB 51 102 122	#33667A
50.0%	50.0% #2E5A6D	RGB 46 90 109	#2E5A6D
66.7%	66.7% #294F5F	RGB 41 79 95	#294F5F
83.3%	83.3% #244351	RGB 36 67 81	#244351
100.0%	100.0% #1F3844	RGB 31 56 68	#1F3844

#3C7F96 #377288 #33667A #2E5A6D #294F5F #244351 #1F3844

#3C7F96 - #2E5A6D - #1F3844

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C7F96 0%, #2E5A6D 50%, #1F3844 100%);
    background: -webkit-linear-gradient(top, #3C7F96 0%, #2E5A6D 50%, #1F3844 100%);
    background: linear-gradient(to bottom, #3C7F96 0%, #2E5A6D 50%, #1F3844 100%);
}
</style>