#9EC0FF - #2D3648 | 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 #9EC0FF to #2D3648

#9EC0FF #2D3648

Calculate the color between two colors, #9EC0FF and #2D3648. 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)

#9EC0FF - #2D3648 | 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 #9EC0FF as 0% and #2D3648 as 100%.

0.0%	0.0% #9EC0FF	RGB 158 192 255	#9EC0FF
16.7%	16.7% #8BA9E0	RGB 139 169 224	#8BA9E0
33.3%	33.3% #7892C2	RGB 120 146 194	#7892C2
50.0%	50.0% #657BA3	RGB 101 123 163	#657BA3
66.7%	66.7% #526484	RGB 82 100 132	#526484
83.3%	83.3% #3F4D66	RGB 63 77 102	#3F4D66
100.0%	100.0% #2D3648	RGB 45 54 72	#2D3648

#9EC0FF #8BA9E0 #7892C2 #657BA3 #526484 #3F4D66 #2D3648

#9EC0FF - #2D3648

HSV Blend

#9EC0FF - #2D3648 | 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 #9EC0FF as 0% and #2D3648 as 100%.

0.0%	0.0% #9EC0FF	RGB 158 192 255	#9EC0FF
16.7%	16.7% #8BA8E0	RGB 139 168 224	#8BA8E0
33.3%	33.3% #7891C2	RGB 120 145 194	#7891C2
50.0%	50.0% #657AA3	RGB 101 122 163	#657AA3
66.7%	66.7% #526384	RGB 82 99 132	#526384
83.3%	83.3% #3F4C66	RGB 63 76 102	#3F4C66
100.0%	100.0% #2D3648	RGB 45 54 72	#2D3648

#9EC0FF #8BA8E0 #7891C2 #657AA3 #526384 #3F4C66 #2D3648

#9EC0FF - #657AA3 - #2D3648

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9EC0FF 0%, #657AA3 50%, #2D3648 100%);
    background: -webkit-linear-gradient(top, #9EC0FF 0%, #657AA3 50%, #2D3648 100%);
    background: linear-gradient(to bottom, #9EC0FF 0%, #657AA3 50%, #2D3648 100%);
}
</style>