#8BA3E4 - #DDE4F7 | 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 #8BA3E4 to #DDE4F7

#8BA3E4 #DDE4F7

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

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

0.0%	0.0% #8BA3E4	RGB 139 163 228	#8BA3E4
16.7%	16.7% #98ADE7	RGB 152 173 231	#98ADE7
33.3%	33.3% #A6B8EA	RGB 166 184 234	#A6B8EA
50.0%	50.0% #B4C3ED	RGB 180 195 237	#B4C3ED
66.7%	66.7% #C1CEF0	RGB 193 206 240	#C1CEF0
83.3%	83.3% #CFD9F3	RGB 207 217 243	#CFD9F3
100.0%	100.0% #DDE4F7	RGB 221 228 247	#DDE4F7

#8BA3E4 #98ADE7 #A6B8EA #B4C3ED #C1CEF0 #CFD9F3 #DDE4F7

#8BA3E4 - #DDE4F7

HSV Blend

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

0.0%	0.0% #8BA2E4	RGB 139 162 228	#8BA2E4
16.7%	16.7% #97ADE7	RGB 151 173 231	#97ADE7
33.3%	33.3% #A5B7EA	RGB 165 183 234	#A5B7EA
50.0%	50.0% #B2C2ED	RGB 178 194 237	#B2C2ED
66.7%	66.7% #C0CDF0	RGB 192 205 240	#C0CDF0
83.3%	83.3% #CED8F3	RGB 206 216 243	#CED8F3
100.0%	100.0% #DDE4F7	RGB 221 228 247	#DDE4F7

#8BA2E4 #97ADE7 #A5B7EA #B2C2ED #C0CDF0 #CED8F3 #DDE4F7

#8BA3E4 - #B2C2ED - #DDE4F7

CSS codes

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

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