#B8D1FF - #5681D6 | 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 #B8D1FF to #5681D6

#B8D1FF #5681D6

Calculate the color between two colors, #B8D1FF and #5681D6. 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)

#B8D1FF - #5681D6 | 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 #B8D1FF as 0% and #5681D6 as 100%.

0.0%	0.0% #B8D1FF	RGB 184 209 255	#B8D1FF
16.7%	16.7% #A7C3F8	RGB 167 195 248	#A7C3F8
33.3%	33.3% #97B6F1	RGB 151 182 241	#97B6F1
50.0%	50.0% #87A9EA	RGB 135 169 234	#87A9EA
66.7%	66.7% #769BE3	RGB 118 155 227	#769BE3
83.3%	83.3% #668EDC	RGB 102 142 220	#668EDC
100.0%	100.0% #5681D6	RGB 86 129 214	#5681D6

#B8D1FF #A7C3F8 #97B6F1 #87A9EA #769BE3 #668EDC #5681D6

#B8D1FF - #5681D6

HSV Blend

#B8D1FF - #5681D6 | 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 #B8D1FF as 0% and #5681D6 as 100%.

0.0%	0.0% #B8D1FF	RGB 184 209 255	#B8D1FF
16.7%	16.7% #A5C2F8	RGB 165 194 248	#A5C2F8
33.3%	33.3% #94B4F1	RGB 148 180 241	#94B4F1
50.0%	50.0% #83A7EA	RGB 131 167 234	#83A7EA
66.7%	66.7% #7399E3	RGB 115 153 227	#7399E3
83.3%	83.3% #648DDC	RGB 100 141 220	#648DDC
100.0%	100.0% #5681D6	RGB 86 129 214	#5681D6

#B8D1FF #A5C2F8 #94B4F1 #83A7EA #7399E3 #648DDC #5681D6

#B8D1FF - #83A7EA - #5681D6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B8D1FF 0%, #83A7EA 50%, #5681D6 100%);
    background: -webkit-linear-gradient(top, #B8D1FF 0%, #83A7EA 50%, #5681D6 100%);
    background: linear-gradient(to bottom, #B8D1FF 0%, #83A7EA 50%, #5681D6 100%);
}
</style>