#DDFBFF - #8DE6F0 | 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 #DDFBFF to #8DE6F0

#DDFBFF #8DE6F0

Calculate the color between two colors, #DDFBFF and #8DE6F0. 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)

#DDFBFF - #8DE6F0 | 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 #DDFBFF as 0% and #8DE6F0 as 100%.

0.0%	0.0% #DDFBFF	RGB 221 251 255	#DDFBFF
16.7%	16.7% #CFF7FC	RGB 207 247 252	#CFF7FC
33.3%	33.3% #C2F4FA	RGB 194 244 250	#C2F4FA
50.0%	50.0% #B5F0F7	RGB 181 240 247	#B5F0F7
66.7%	66.7% #A7EDF5	RGB 167 237 245	#A7EDF5
83.3%	83.3% #9AE9F2	RGB 154 233 242	#9AE9F2
100.0%	100.0% #8DE6F0	RGB 141 230 240	#8DE6F0

#DDFBFF #CFF7FC #C2F4FA #B5F0F7 #A7EDF5 #9AE9F2 #8DE6F0

#DDFBFF - #8DE6F0

HSV Blend

#DDFBFF - #8DE6F0 | 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 #DDFBFF as 0% and #8DE6F0 as 100%.

0.0%	0.0% #DDFBFF	RGB 221 251 255	#DDFBFF
16.7%	16.7% #CFF7FC	RGB 207 247 252	#CFF7FC
33.3%	33.3% #C1F3FA	RGB 193 243 250	#C1F3FA
50.0%	50.0% #B3F0F7	RGB 179 240 247	#B3F0F7
66.7%	66.7% #A6ECF5	RGB 166 236 245	#A6ECF5
83.3%	83.3% #99E9F2	RGB 153 233 242	#99E9F2
100.0%	100.0% #8DE6F0	RGB 141 230 240	#8DE6F0

#DDFBFF #CFF7FC #C1F3FA #B3F0F7 #A6ECF5 #99E9F2 #8DE6F0

#DDFBFF - #B3F0F7 - #8DE6F0

CSS codes

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

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