#B5CFEC - #5981B9 | 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 #B5CFEC to #5981B9

#B5CFEC #5981B9

Calculate the color between two colors, #B5CFEC and #5981B9. 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)

#B5CFEC - #5981B9 | 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 #B5CFEC as 0% and #5981B9 as 100%.

0.0%	0.0% #B5CFEC	RGB 181 207 236	#B5CFEC
16.7%	16.7% #A5C2E3	RGB 165 194 227	#A5C2E3
33.3%	33.3% #96B5DB	RGB 150 181 219	#96B5DB
50.0%	50.0% #87A8D2	RGB 135 168 210	#87A8D2
66.7%	66.7% #779BCA	RGB 119 155 202	#779BCA
83.3%	83.3% #688EC1	RGB 104 142 193	#688EC1
100.0%	100.0% #5981B9	RGB 89 129 185	#5981B9

#B5CFEC #A5C2E3 #96B5DB #87A8D2 #779BCA #688EC1 #5981B9

#B5CFEC - #5981B9

HSV Blend

#B5CFEC - #5981B9 | 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 #B5CFEC as 0% and #5981B9 as 100%.

0.0%	0.0% #B5CFEC	RGB 181 207 236	#B5CFEC
16.7%	16.7% #A3C1E3	RGB 163 193 227	#A3C1E3
33.3%	33.3% #93B3DB	RGB 147 179 219	#93B3DB
50.0%	50.0% #83A6D2	RGB 131 166 210	#83A6D2
66.7%	66.7% #7499CA	RGB 116 153 202	#7499CA
83.3%	83.3% #668DC1	RGB 102 141 193	#668DC1
100.0%	100.0% #5981B9	RGB 89 129 185	#5981B9

#B5CFEC #A3C1E3 #93B3DB #83A6D2 #7499CA #668DC1 #5981B9

#B5CFEC - #83A6D2 - #5981B9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B5CFEC 0%, #83A6D2 50%, #5981B9 100%);
    background: -webkit-linear-gradient(top, #B5CFEC 0%, #83A6D2 50%, #5981B9 100%);
    background: linear-gradient(to bottom, #B5CFEC 0%, #83A6D2 50%, #5981B9 100%);
}
</style>