#8AC2FF - #DDEDFF | 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 #8AC2FF to #DDEDFF

#8AC2FF #DDEDFF

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

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

0.0%	0.0% #8AC2FF	RGB 138 194 255	#8AC2FF
16.7%	16.7% #97C9FF	RGB 151 201 255	#97C9FF
33.3%	33.3% #A5D0FF	RGB 165 208 255	#A5D0FF
50.0%	50.0% #B3D7FF	RGB 179 215 255	#B3D7FF
66.7%	66.7% #C1DEFF	RGB 193 222 255	#C1DEFF
83.3%	83.3% #CFE5FF	RGB 207 229 255	#CFE5FF
100.0%	100.0% #DDEDFF	RGB 221 237 255	#DDEDFF

#8AC2FF #97C9FF #A5D0FF #B3D7FF #C1DEFF #CFE5FF #DDEDFF

#8AC2FF - #DDEDFF

HSV Blend

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

0.0%	0.0% #8AC2FF	RGB 138 194 255	#8AC2FF
16.7%	16.7% #97C9FF	RGB 151 201 255	#97C9FF
33.3%	33.3% #A5D0FF	RGB 165 208 255	#A5D0FF
50.0%	50.0% #B3D7FF	RGB 179 215 255	#B3D7FF
66.7%	66.7% #C1DEFF	RGB 193 222 255	#C1DEFF
83.3%	83.3% #CFE5FF	RGB 207 229 255	#CFE5FF
100.0%	100.0% #DDEDFF	RGB 221 237 255	#DDEDFF

#8AC2FF #97C9FF #A5D0FF #B3D7FF #C1DEFF #CFE5FF #DDEDFF

#8AC2FF - #B3D7FF - #DDEDFF

CSS codes

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

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