#B5CEFD - #333A48 | 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 #B5CEFD to #333A48

#B5CEFD #333A48

Calculate the color between two colors, #B5CEFD and #333A48. 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)

#B5CEFD - #333A48 | 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 #B5CEFD as 0% and #333A48 as 100%.

0.0%	0.0% #B5CEFD	RGB 181 206 253	#B5CEFD
16.7%	16.7% #9FB5DE	RGB 159 181 222	#9FB5DE
33.3%	33.3% #899CC0	RGB 137 156 192	#899CC0
50.0%	50.0% #7484A2	RGB 116 132 162	#7484A2
66.7%	66.7% #5E6B84	RGB 94 107 132	#5E6B84
83.3%	83.3% #485266	RGB 72 82 102	#485266
100.0%	100.0% #333A48	RGB 51 58 72	#333A48

#B5CEFD #9FB5DE #899CC0 #7484A2 #5E6B84 #485266 #333A48

#B5CEFD - #333A48

HSV Blend

#B5CEFD - #333A48 | 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 #B5CEFD as 0% and #333A48 as 100%.

0.0%	0.0% #B5CEFD	RGB 181 206 253	#B5CEFD
16.7%	16.7% #9FB5DE	RGB 159 181 222	#9FB5DE
33.3%	33.3% #899CC0	RGB 137 156 192	#899CC0
50.0%	50.0% #7383A2	RGB 115 131 162	#7383A2
66.7%	66.7% #5E6A84	RGB 94 106 132	#5E6A84
83.3%	83.3% #485266	RGB 72 82 102	#485266
100.0%	100.0% #333A48	RGB 51 58 72	#333A48

#B5CEFD #9FB5DE #899CC0 #7383A2 #5E6A84 #485266 #333A48

#B5CEFD - #7383A2 - #333A48

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5CEFD 0%, #7383A2 50%, #333A48 100%);
    background: -webkit-linear-gradient(top, #B5CEFD 0%, #7383A2 50%, #333A48 100%);
    background: linear-gradient(to bottom, #B5CEFD 0%, #7383A2 50%, #333A48 100%);
}
</style>