#8ED0FF - #3182DA | 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 #8ED0FF to #3182DA

#8ED0FF #3182DA

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

#8ED0FF - #3182DA | 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 #8ED0FF as 0% and #3182DA as 100%.

0.0%	0.0% #8ED0FF	RGB 142 208 255	#8ED0FF
16.7%	16.7% #7EC3F8	RGB 126 195 248	#7EC3F8
33.3%	33.3% #6FB6F2	RGB 111 182 242	#6FB6F2
50.0%	50.0% #5FA9EC	RGB 95 169 236	#5FA9EC
66.7%	66.7% #509CE6	RGB 80 156 230	#509CE6
83.3%	83.3% #408FE0	RGB 64 143 224	#408FE0
100.0%	100.0% #3182DA	RGB 49 130 218	#3182DA

#8ED0FF #7EC3F8 #6FB6F2 #5FA9EC #509CE6 #408FE0 #3182DA

#8ED0FF - #3182DA

HSV Blend

#8ED0FF - #3182DA | 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 #8ED0FF as 0% and #3182DA as 100%.

0.0%	0.0% #8ED0FF	RGB 142 208 255	#8ED0FF
16.7%	16.7% #7CC3F8	RGB 124 195 248	#7CC3F8
33.3%	33.3% #6CB6F2	RGB 108 182 242	#6CB6F2
50.0%	50.0% #5CA9EC	RGB 92 169 236	#5CA9EC
66.7%	66.7% #4D9BE6	RGB 77 155 230	#4D9BE6
83.3%	83.3% #3E8EE0	RGB 62 142 224	#3E8EE0
100.0%	100.0% #3182DA	RGB 49 130 218	#3182DA

#8ED0FF #7CC3F8 #6CB6F2 #5CA9EC #4D9BE6 #3E8EE0 #3182DA

#8ED0FF - #5CA9EC - #3182DA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8ED0FF 0%, #5CA9EC 50%, #3182DA 100%);
    background: -webkit-linear-gradient(top, #8ED0FF 0%, #5CA9EC 50%, #3182DA 100%);
    background: linear-gradient(to bottom, #8ED0FF 0%, #5CA9EC 50%, #3182DA 100%);
}
</style>