#18A499 - #BDE5E1 | 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 #18A499 a #BDE5E1

#18A499 #BDE5E1

Calcule el color entre dos colores, #18A499 y #BDE5E1. 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)

#18A499 - #BDE5E1 | 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 #18A499 como 0% y #BDE5E1 como 100%.

0.0%	0.0% #18A499	RGB 24 164 153	#18A499
16.7%	16.7% #33AEA5	RGB 51 174 165	#33AEA5
33.3%	33.3% #4FB9B1	RGB 79 185 177	#4FB9B1
50.0%	50.0% #6AC4BD	RGB 106 196 189	#6AC4BD
66.7%	66.7% #86CFC9	RGB 134 207 201	#86CFC9
83.3%	83.3% #A1DAD5	RGB 161 218 213	#A1DAD5
100.0%	100.0% #BDE5E1	RGB 189 229 225	#BDE5E1

#18A499 #33AEA5 #4FB9B1 #6AC4BD #86CFC9 #A1DAD5 #BDE5E1

#18A499 - #BDE5E1

Mezcla HSV

#18A499 - #BDE5E1 | 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 #18A499 como 0% y #BDE5E1 como 100%.

0.0%	0.0% #18A499	RGB 24 164 153	#18A499
16.7%	16.7% #2DAEA4	RGB 45 174 164	#2DAEA4
33.3%	33.3% #45B9AF	RGB 69 185 175	#45B9AF
50.0%	50.0% #5FC4BB	RGB 95 196 187	#5FC4BB
66.7%	66.7% #7CCFC7	RGB 124 207 199	#7CCFC7
83.3%	83.3% #9BDAD4	RGB 155 218 212	#9BDAD4
100.0%	100.0% #BDE5E1	RGB 189 229 225	#BDE5E1

#18A499 #2DAEA4 #45B9AF #5FC4BB #7CCFC7 #9BDAD4 #BDE5E1

#18A499 - #5FC4BB - #BDE5E1

Códigos CSS

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #18A499 0%, #5FC4BB 50%, #BDE5E1 100%);
    background: -webkit-linear-gradient(top, #18A499 0%, #5FC4BB 50%, #BDE5E1 100%);
    background: linear-gradient(to bottom, #18A499 0%, #5FC4BB 50%, #BDE5E1 100%);
}
</style>