#CCF980 - #8ADE33 | 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 #8ADE33

#CCF980 #8ADE33

Calculate the color between two colors, #CCF980 and #8ADE33. 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 - #8ADE33 | 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 #8ADE33 as 100%.

0.0%	0.0% #CCF980	RGB 204 249 128	#CCF980
16.7%	16.7% #C1F473	RGB 193 244 115	#C1F473
33.3%	33.3% #B6F066	RGB 182 240 102	#B6F066
50.0%	50.0% #ABEB59	RGB 171 235 89	#ABEB59
66.7%	66.7% #A0E74C	RGB 160 231 76	#A0E74C
83.3%	83.3% #95E23F	RGB 149 226 63	#95E23F
100.0%	100.0% #8ADE33	RGB 138 222 51	#8ADE33

#CCF980 #C1F473 #B6F066 #ABEB59 #A0E74C #95E23F #8ADE33

#CCF980 - #8ADE33

HSV Blend

#CCF980 - #8ADE33 | 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 #8ADE33 as 100%.

0.0%	0.0% #CCF980	RGB 204 249 128	#CCF980
16.7%	16.7% #C1F472	RGB 193 244 114	#C1F472
33.3%	33.3% #B6F064	RGB 182 240 100	#B6F064
50.0%	50.0% #ABEB57	RGB 171 235 87	#ABEB57
66.7%	66.7% #A0E74A	RGB 160 231 74	#A0E74A
83.3%	83.3% #95E23E	RGB 149 226 62	#95E23E
100.0%	100.0% #8ADE33	RGB 138 222 51	#8ADE33

#CCF980 #C1F472 #B6F064 #ABEB57 #A0E74A #95E23E #8ADE33

#CCF980 - #ABEB57 - #8ADE33

CSS codes

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

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