#CCFF3C - #FFFC86 | 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 #CCFF3C to #FFFC86

#CCFF3C #FFFC86

Calculate the color between two colors, #CCFF3C and #FFFC86. 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)

#CCFF3C - #FFFC86 | 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 #CCFF3C as 0% and #FFFC86 as 100%.

0.0%	0.0% #CCFF3C	RGB 204 255 60	#CCFF3C
16.7%	16.7% #D4FE48	RGB 212 254 72	#D4FE48
33.3%	33.3% #DDFE54	RGB 221 254 84	#DDFE54
50.0%	50.0% #E5FD61	RGB 229 253 97	#E5FD61
66.7%	66.7% #EEFD6D	RGB 238 253 109	#EEFD6D
83.3%	83.3% #F6FC79	RGB 246 252 121	#F6FC79
100.0%	100.0% #FFFC86	RGB 255 252 134	#FFFC86

#CCFF3C #D4FE48 #DDFE54 #E5FD61 #EEFD6D #F6FC79 #FFFC86

#CCFF3C - #FFFC86

HSV Blend

#CCFF3C - #FFFC86 | 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 #CCFF3C as 0% and #FFFC86 as 100%.

0.0%	0.0% #CCFF3B	RGB 204 255 59	#CCFF3B
16.7%	16.7% #D7FF48	RGB 215 255 72	#D7FF48
33.3%	33.3% #E2FF54	RGB 226 255 84	#E2FF54
50.0%	50.0% #ECFF61	RGB 236 255 97	#ECFF61
66.7%	66.7% #F4FF6D	RGB 244 255 109	#F4FF6D
83.3%	83.3% #FBFF79	RGB 251 255 121	#FBFF79
100.0%	100.0% #FFFC86	RGB 255 252 134	#FFFC86

#CCFF3B #D7FF48 #E2FF54 #ECFF61 #F4FF6D #FBFF79 #FFFC86

#CCFF3C - #ECFF61 - #FFFC86

CSS codes

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

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