#0017A8 - #B6BCE6 | 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 #0017A8 to #B6BCE6

#0017A8 #B6BCE6

Calculate the color between two colors, #0017A8 and #B6BCE6. 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)

#0017A8 - #B6BCE6 | 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 #0017A8 as 0% and #B6BCE6 as 100%.

0.0%	0.0% #0017A8	RGB 0 23 168	#0017A8
16.7%	16.7% #1E32B2	RGB 30 50 178	#1E32B2
33.3%	33.3% #3C4EBC	RGB 60 78 188	#3C4EBC
50.0%	50.0% #5B69C7	RGB 91 105 199	#5B69C7
66.7%	66.7% #7985D1	RGB 121 133 209	#7985D1
83.3%	83.3% #97A0DB	RGB 151 160 219	#97A0DB
100.0%	100.0% #B6BCE6	RGB 182 188 230	#B6BCE6

#0017A8 #1E32B2 #3C4EBC #5B69C7 #7985D1 #97A0DB #B6BCE6

#0017A8 - #B6BCE6

HSV Blend

#0017A8 - #B6BCE6 | 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 #0017A8 as 0% and #B6BCE6 as 100%.

0.0%	0.0% #0017A8	RGB 0 23 168	#0017A8
16.7%	16.7% #172CB2	RGB 23 44 178	#172CB2
33.3%	33.3% #3144BC	RGB 49 68 188	#3144BC
50.0%	50.0% #4E5EC7	RGB 78 94 199	#4E5EC7
66.7%	66.7% #6E7BD1	RGB 110 123 209	#6E7BD1
83.3%	83.3% #909ADB	RGB 144 154 219	#909ADB
100.0%	100.0% #B6BCE6	RGB 182 188 230	#B6BCE6

#0017A8 #172CB2 #3144BC #4E5EC7 #6E7BD1 #909ADB #B6BCE6

#0017A8 - #4E5EC7 - #B6BCE6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0017A8 0%, #4E5EC7 50%, #B6BCE6 100%);
    background: -webkit-linear-gradient(top, #0017A8 0%, #4E5EC7 50%, #B6BCE6 100%);
    background: linear-gradient(to bottom, #0017A8 0%, #4E5EC7 50%, #B6BCE6 100%);
}
</style>