#48DCDC - #00B4B7 | 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 #48DCDC a #00B4B7

#48DCDC #00B4B7

Calcule el color entre dos colores, #48DCDC y #00B4B7. 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)

#48DCDC - #00B4B7 | 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 #48DCDC como 0% y #00B4B7 como 100%.

0.0%	0.0% #48DCDC	RGB 72 220 220	#48DCDC
16.7%	16.7% #3CD5D5	RGB 60 213 213	#3CD5D5
33.3%	33.3% #30CECF	RGB 48 206 207	#30CECF
50.0%	50.0% #24C8C9	RGB 36 200 201	#24C8C9
66.7%	66.7% #18C1C3	RGB 24 193 195	#18C1C3
83.3%	83.3% #0CBABD	RGB 12 186 189	#0CBABD
100.0%	100.0% #00B4B7	RGB 0 180 183	#00B4B7

#48DCDC #3CD5D5 #30CECF #24C8C9 #18C1C3 #0CBABD #00B4B7

#48DCDC - #00B4B7

Mezcla HSV

#48DCDC - #00B4B7 | 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 #48DCDC como 0% y #00B4B7 como 100%.

0.0%	0.0% #48DCDC	RGB 72 220 220	#48DCDC
16.7%	16.7% #3AD5D5	RGB 58 213 213	#3AD5D5
33.3%	33.3% #2DCECF	RGB 45 206 207	#2DCECF
50.0%	50.0% #20C8C9	RGB 32 200 201	#20C8C9
66.7%	66.7% #15C1C3	RGB 21 193 195	#15C1C3
83.3%	83.3% #0ABABD	RGB 10 186 189	#0ABABD
100.0%	100.0% #00B4B7	RGB 0 180 183	#00B4B7

#48DCDC #3AD5D5 #2DCECF #20C8C9 #15C1C3 #0ABABD #00B4B7

#48DCDC - #20C8C9 - #00B4B7

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #48DCDC 0%, #20C8C9 50%, #00B4B7 100%);
    background: -webkit-linear-gradient(top, #48DCDC 0%, #20C8C9 50%, #00B4B7 100%);
    background: linear-gradient(to bottom, #48DCDC 0%, #20C8C9 50%, #00B4B7 100%);
}
</style>