#CCF980 - #F0FDDA | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #CCF980 to #F0FDDA

#CCF980 #F0FDDA

Calculate the color between two colors, #CCF980 and #F0FDDA. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#CCF980 - #F0FDDA | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #CCF980 as 0% and #F0FDDA as 100%.

0.0%	0.0% #CCF980	RGB 204 249 128	#CCF980
16.7%	16.7% #D2F98F	RGB 210 249 143	#D2F98F
33.3%	33.3% #D8FA9E	RGB 216 250 158	#D8FA9E
50.0%	50.0% #DEFBAD	RGB 222 251 173	#DEFBAD
66.7%	66.7% #E4FBBC	RGB 228 251 188	#E4FBBC
83.3%	83.3% #EAFCCB	RGB 234 252 203	#EAFCCB
100.0%	100.0% #F0FDDA	RGB 240 253 218	#F0FDDA

#CCF980 #D2F98F #D8FA9E #DEFBAD #E4FBBC #EAFCCB #F0FDDA

#CCF980 - #F0FDDA

HSV Blend

#CCF980 - #F0FDDA | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #CCF980 as 0% and #F0FDDA as 100%.

0.0%	0.0% #CCF980	RGB 204 249 128	#CCF980
16.7%	16.7% #D1F98E	RGB 209 249 142	#D1F98E
33.3%	33.3% #D7FA9D	RGB 215 250 157	#D7FA9D
50.0%	50.0% #DDFBAC	RGB 221 251 172	#DDFBAC
66.7%	66.7% #E3FBBB	RGB 227 251 187	#E3FBBB
83.3%	83.3% #E9FCCA	RGB 233 252 202	#E9FCCA
100.0%	100.0% #F0FDDA	RGB 240 253 218	#F0FDDA

#CCF980 #D1F98E #D7FA9D #DDFBAC #E3FBBB #E9FCCA #F0FDDA

#CCF980 - #DDFBAC - #F0FDDA

CSS codes

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

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