#A8D4B2 - #CCD3FF | 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 #A8D4B2 to #CCD3FF

#A8D4B2 #CCD3FF

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

#A8D4B2 - #CCD3FF | 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 #A8D4B2 as 0% and #CCD3FF as 100%.

0.0%	0.0% #A8D4B2	RGB 168 212 178	#A8D4B2
16.7%	16.7% #AED3BE	RGB 174 211 190	#AED3BE
33.3%	33.3% #B4D3CB	RGB 180 211 203	#B4D3CB
50.0%	50.0% #BAD3D8	RGB 186 211 216	#BAD3D8
66.7%	66.7% #C0D3E5	RGB 192 211 229	#C0D3E5
83.3%	83.3% #C6D3F2	RGB 198 211 242	#C6D3F2
100.0%	100.0% #CCD3FF	RGB 204 211 255	#CCD3FF

#A8D4B2 #AED3BE #B4D3CB #BAD3D8 #C0D3E5 #C6D3F2 #CCD3FF

#A8D4B2 - #CCD3FF

HSV Blend

#A8D4B2 - #CCD3FF | 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 #A8D4B2 as 0% and #CCD3FF as 100%.

0.0%	0.0% #A8D4B2	RGB 168 212 178	#A8D4B2
16.7%	16.7% #ADDBC4	RGB 173 219 196	#ADDBC4
33.3%	33.3% #B3E2D7	RGB 179 226 215	#B3E2D7
50.0%	50.0% #B9E7E9	RGB 185 231 233	#B9E7E9
66.7%	66.7% #BFE1F0	RGB 191 225 240	#BFE1F0
83.3%	83.3% #C5DAF7	RGB 197 218 247	#C5DAF7
100.0%	100.0% #CCD3FF	RGB 204 211 255	#CCD3FF

#A8D4B2 #ADDBC4 #B3E2D7 #B9E7E9 #BFE1F0 #C5DAF7 #CCD3FF

#A8D4B2 - #B9E7E9 - #CCD3FF

CSS codes

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

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