#00488E - #B6CADE | 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 #00488E to #B6CADE

#00488E #B6CADE

Calculate the color between two colors, #00488E and #B6CADE. 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)

#00488E - #B6CADE | 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 #00488E as 0% and #B6CADE as 100%.

0.0%	0.0% #00488E	RGB 0 72 142	#00488E
16.7%	16.7% #1E5D9B	RGB 30 93 155	#1E5D9B
33.3%	33.3% #3C73A8	RGB 60 115 168	#3C73A8
50.0%	50.0% #5B89B6	RGB 91 137 182	#5B89B6
66.7%	66.7% #799EC3	RGB 121 158 195	#799EC3
83.3%	83.3% #97B4D0	RGB 151 180 208	#97B4D0
100.0%	100.0% #B6CADE	RGB 182 202 222	#B6CADE

#00488E #1E5D9B #3C73A8 #5B89B6 #799EC3 #97B4D0 #B6CADE

#00488E - #B6CADE

HSV Blend

#00488E - #B6CADE | 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 #00488E as 0% and #B6CADE as 100%.

0.0%	0.0% #00478E	RGB 0 71 142	#00478E
16.7%	16.7% #15599B	RGB 21 89 155	#15599B
33.3%	33.3% #2E6BA8	RGB 46 107 168	#2E6BA8
50.0%	50.0% #4A80B6	RGB 74 128 182	#4A80B6
66.7%	66.7% #6A97C3	RGB 106 151 195	#6A97C3
83.3%	83.3% #8EAFD0	RGB 142 175 208	#8EAFD0
100.0%	100.0% #B6CADE	RGB 182 202 222	#B6CADE

#00478E #15599B #2E6BA8 #4A80B6 #6A97C3 #8EAFD0 #B6CADE

#00488E - #4A80B6 - #B6CADE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00478E 0%, #4A80B6 50%, #B6CADE 100%);
    background: -webkit-linear-gradient(top, #00478E 0%, #4A80B6 50%, #B6CADE 100%);
    background: linear-gradient(to bottom, #00478E 0%, #4A80B6 50%, #B6CADE 100%);
}
</style>