#09306B - #B8C3D4 | 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 #09306B to #B8C3D4

#09306B #B8C3D4

Calculate the color between two colors, #09306B and #B8C3D4. 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)

#09306B - #B8C3D4 | 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 #09306B as 0% and #B8C3D4 as 100%.

0.0%	0.0% #09306B	RGB 9 48 107	#09306B
16.7%	16.7% #26487C	RGB 38 72 124	#26487C
33.3%	33.3% #43618E	RGB 67 97 142	#43618E
50.0%	50.0% #60799F	RGB 96 121 159	#60799F
66.7%	66.7% #7D92B1	RGB 125 146 177	#7D92B1
83.3%	83.3% #9AAAC2	RGB 154 170 194	#9AAAC2
100.0%	100.0% #B8C3D4	RGB 184 195 212	#B8C3D4

#09306B #26487C #43618E #60799F #7D92B1 #9AAAC2 #B8C3D4

#09306B - #B8C3D4

HSV Blend

#09306B - #B8C3D4 | 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 #09306B as 0% and #B8C3D4 as 100%.

0.0%	0.0% #09306B	RGB 9 48 107	#09306B
16.7%	16.7% #1A417C	RGB 26 65 124	#1A417C
33.3%	33.3% #31558E	RGB 49 85 142	#31558E
50.0%	50.0% #4B6C9F	RGB 75 108 159	#4B6C9F
66.7%	66.7% #6B86B1	RGB 107 134 177	#6B86B1
83.3%	83.3% #8FA3C2	RGB 143 163 194	#8FA3C2
100.0%	100.0% #B8C3D4	RGB 184 195 212	#B8C3D4

#09306B #1A417C #31558E #4B6C9F #6B86B1 #8FA3C2 #B8C3D4

#09306B - #4B6C9F - #B8C3D4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #09306B 0%, #4B6C9F 50%, #B8C3D4 100%);
    background: -webkit-linear-gradient(top, #09306B 0%, #4B6C9F 50%, #B8C3D4 100%);
    background: linear-gradient(to bottom, #09306B 0%, #4B6C9F 50%, #B8C3D4 100%);
}
</style>