#00558B - #B6CEDD | 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 #00558B to #B6CEDD

#00558B #B6CEDD

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

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

0.0%	0.0% #00558B	RGB 0 85 139	#00558B
16.7%	16.7% #1E6998	RGB 30 105 152	#1E6998
33.3%	33.3% #3C7DA6	RGB 60 125 166	#3C7DA6
50.0%	50.0% #5B91B4	RGB 91 145 180	#5B91B4
66.7%	66.7% #79A5C1	RGB 121 165 193	#79A5C1
83.3%	83.3% #97B9CF	RGB 151 185 207	#97B9CF
100.0%	100.0% #B6CEDD	RGB 182 206 221	#B6CEDD

#00558B #1E6998 #3C7DA6 #5B91B4 #79A5C1 #97B9CF #B6CEDD

#00558B - #B6CEDD

HSV Blend

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

0.0%	0.0% #00548B	RGB 0 84 139	#00548B
16.7%	16.7% #146598	RGB 20 101 152	#146598
33.3%	33.3% #2D77A6	RGB 45 119 166	#2D77A6
50.0%	50.0% #4A8BB4	RGB 74 139 180	#4A8BB4
66.7%	66.7% #6A9FC1	RGB 106 159 193	#6A9FC1
83.3%	83.3% #8EB6CF	RGB 142 182 207	#8EB6CF
100.0%	100.0% #B6CEDD	RGB 182 206 221	#B6CEDD

#00548B #146598 #2D77A6 #4A8BB4 #6A9FC1 #8EB6CF #B6CEDD

#00558B - #4A8BB4 - #B6CEDD

CSS codes

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

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