#CCDA3E - #788500 | 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 #CCDA3E to #788500

#CCDA3E #788500

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

#CCDA3E - #788500 | 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 #CCDA3E as 0% and #788500 as 100%.

0.0%	0.0% #CCDA3E	RGB 204 218 62	#CCDA3E
16.7%	16.7% #BECB33	RGB 190 203 51	#BECB33
33.3%	33.3% #B0BD29	RGB 176 189 41	#B0BD29
50.0%	50.0% #A2AF1F	RGB 162 175 31	#A2AF1F
66.7%	66.7% #94A114	RGB 148 161 20	#94A114
83.3%	83.3% #86930A	RGB 134 147 10	#86930A
100.0%	100.0% #788500	RGB 120 133 0	#788500

#CCDA3E #BECB33 #B0BD29 #A2AF1F #94A114 #86930A #788500

#CCDA3E - #788500

HSV Blend

#CCDA3E - #788500 | 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 #CCDA3E as 0% and #788500 as 100%.

0.0%	0.0% #CCDA3E	RGB 204 218 62	#CCDA3E
16.7%	16.7% #BDCB30	RGB 189 203 48	#BDCB30
33.3%	33.3% #AFBD23	RGB 175 189 35	#AFBD23
50.0%	50.0% #A1AF18	RGB 161 175 24	#A1AF18
66.7%	66.7% #93A10F	RGB 147 161 15	#93A10F
83.3%	83.3% #859306	RGB 133 147 6	#859306
100.0%	100.0% #788500	RGB 120 133 0	#788500

#CCDA3E #BDCB30 #AFBD23 #A1AF18 #93A10F #859306 #788500

#CCDA3E - #A1AF18 - #788500

CSS codes

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

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