#FFB053 - #F0FF6B | 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 #FFB053 a #F0FF6B

#FFB053 #F0FF6B

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

#FFB053 - #F0FF6B | 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 #FFB053 como 0% y #F0FF6B como 100%.

0.0%	0.0% #FFB053	RGB 255 176 83	#FFB053
16.7%	16.7% #FCBD57	RGB 252 189 87	#FCBD57
33.3%	33.3% #FACA5B	RGB 250 202 91	#FACA5B
50.0%	50.0% #F7D75F	RGB 247 215 95	#F7D75F
66.7%	66.7% #F5E463	RGB 245 228 99	#F5E463
83.3%	83.3% #F2F167	RGB 242 241 103	#F2F167
100.0%	100.0% #F0FF6B	RGB 240 255 107	#F0FF6B

#FFB053 #FCBD57 #FACA5B #F7D75F #F5E463 #F2F167 #F0FF6B

#FFB053 - #F0FF6B

Mezcla HSV

#FFB053 - #F0FF6B | 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 #FFB053 como 0% y #F0FF6B como 100%.

0.0%	0.0% #FFB053	RGB 255 176 83	#FFB053
16.7%	16.7% #FFC157	RGB 255 193 87	#FFC157
33.3%	33.3% #FFD25B	RGB 255 210 91	#FFD25B
50.0%	50.0% #FFE25F	RGB 255 226 95	#FFE25F
66.7%	66.7% #FFF163	RGB 255 241 99	#FFF163
83.3%	83.3% #FDFF67	RGB 253 255 103	#FDFF67
100.0%	100.0% #F0FF6B	RGB 240 255 107	#F0FF6B

#FFB053 #FFC157 #FFD25B #FFE25F #FFF163 #FDFF67 #F0FF6B

#FFB053 - #FFE25F - #F0FF6B

Códigos CSS

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

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