#3C4A50 - #669ABF | 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 #3C4A50 a #669ABF

#3C4A50 #669ABF

Calcule el color entre dos colores, #3C4A50 y #669ABF. 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)

#3C4A50 - #669ABF | 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 #3C4A50 como 0% y #669ABF como 100%.

0.0%	0.0% #3C4A50	RGB 60 74 80	#3C4A50
16.7%	16.7% #435762	RGB 67 87 98	#435762
33.3%	33.3% #4A6475	RGB 74 100 117	#4A6475
50.0%	50.0% #517287	RGB 81 114 135	#517287
66.7%	66.7% #587F9A	RGB 88 127 154	#587F9A
83.3%	83.3% #5F8CAC	RGB 95 140 172	#5F8CAC
100.0%	100.0% #669ABF	RGB 102 154 191	#669ABF

#3C4A50 #435762 #4A6475 #517287 #587F9A #5F8CAC #669ABF

#3C4A50 - #669ABF

Mezcla HSV

#3C4A50 - #669ABF | 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 #3C4A50 como 0% y #669ABF como 100%.

0.0%	0.0% #3C4A50	RGB 60 74 80	#3C4A50
16.7%	16.7% #465962	RGB 70 89 98	#465962
33.3%	33.3% #4F6875	RGB 79 104 117	#4F6875
50.0%	50.0% #567687	RGB 86 118 135	#567687
66.7%	66.7% #5D839A	RGB 93 131 154	#5D839A
83.3%	83.3% #628FAC	RGB 98 143 172	#628FAC
100.0%	100.0% #669ABF	RGB 102 154 191	#669ABF

#3C4A50 #465962 #4F6875 #567687 #5D839A #628FAC #669ABF

#3C4A50 - #567687 - #669ABF

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4A50 0%, #567687 50%, #669ABF 100%);
    background: -webkit-linear-gradient(top, #3C4A50 0%, #567687 50%, #669ABF 100%);
    background: linear-gradient(to bottom, #3C4A50 0%, #567687 50%, #669ABF 100%);
}
</style>