#B3E2FF - #334048 | 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 #B3E2FF to #334048

#B3E2FF #334048

Calculate the color between two colors, #B3E2FF and #334048. 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)

#B3E2FF - #334048 | 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 #B3E2FF as 0% and #334048 as 100%.

0.0%	0.0% #B3E2FF	RGB 179 226 255	#B3E2FF
16.7%	16.7% #9DC7E0	RGB 157 199 224	#9DC7E0
33.3%	33.3% #88ACC2	RGB 136 172 194	#88ACC2
50.0%	50.0% #7391A3	RGB 115 145 163	#7391A3
66.7%	66.7% #5D7684	RGB 93 118 132	#5D7684
83.3%	83.3% #485B66	RGB 72 91 102	#485B66
100.0%	100.0% #334048	RGB 51 64 72	#334048

#B3E2FF #9DC7E0 #88ACC2 #7391A3 #5D7684 #485B66 #334048

#B3E2FF - #334048

HSV Blend

#B3E2FF - #334048 | 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 #B3E2FF as 0% and #334048 as 100%.

0.0%	0.0% #B3E2FF	RGB 179 226 255	#B3E2FF
16.7%	16.7% #9DC7E0	RGB 157 199 224	#9DC7E0
33.3%	33.3% #88ACC2	RGB 136 172 194	#88ACC2
50.0%	50.0% #7391A3	RGB 115 145 163	#7391A3
66.7%	66.7% #5D7684	RGB 93 118 132	#5D7684
83.3%	83.3% #485B66	RGB 72 91 102	#485B66
100.0%	100.0% #334048	RGB 51 64 72	#334048

#B3E2FF #9DC7E0 #88ACC2 #7391A3 #5D7684 #485B66 #334048

#B3E2FF - #7391A3 - #334048

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B3E2FF 0%, #7391A3 50%, #334048 100%);
    background: -webkit-linear-gradient(top, #B3E2FF 0%, #7391A3 50%, #334048 100%);
    background: linear-gradient(to bottom, #B3E2FF 0%, #7391A3 50%, #334048 100%);
}
</style>