#309696 - #006653 | 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 #309696 a #006653

#309696 #006653

Calcule el color entre dos colores, #309696 y #006653. 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)

#309696 - #006653 | 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 #309696 como 0% y #006653 como 100%.

0.0%	0.0% #309696	RGB 48 150 150	#309696
16.7%	16.7% #288E8A	RGB 40 142 138	#288E8A
33.3%	33.3% #20867F	RGB 32 134 127	#20867F
50.0%	50.0% #187E74	RGB 24 126 116	#187E74
66.7%	66.7% #107669	RGB 16 118 105	#107669
83.3%	83.3% #086E5E	RGB 8 110 94	#086E5E
100.0%	100.0% #006653	RGB 0 102 83	#006653

#309696 #288E8A #20867F #187E74 #107669 #086E5E #006653

#309696 - #006653

Mezcla HSV

#309696 - #006653 | 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 #309696 como 0% y #006653 como 100%.

0.0%	0.0% #309696	RGB 48 150 150	#309696
16.7%	16.7% #258E8A	RGB 37 142 138	#258E8A
33.3%	33.3% #1C867F	RGB 28 134 127	#1C867F
50.0%	50.0% #147E74	RGB 20 126 116	#147E74
66.7%	66.7% #0C7668	RGB 12 118 104	#0C7668
83.3%	83.3% #056E5D	RGB 5 110 93	#056E5D
100.0%	100.0% #006653	RGB 0 102 83	#006653

#309696 #258E8A #1C867F #147E74 #0C7668 #056E5D #006653

#309696 - #147E74 - #006653

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #309696 0%, #147E74 50%, #006653 100%);
    background: -webkit-linear-gradient(top, #309696 0%, #147E74 50%, #006653 100%);
    background: linear-gradient(to bottom, #309696 0%, #147E74 50%, #006653 100%);
}
</style>