#B4D5E8 - #5C89B4 | 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 #B4D5E8 to #5C89B4

#B4D5E8 #5C89B4

Calculate the color between two colors, #B4D5E8 and #5C89B4. 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)

#B4D5E8 - #5C89B4 | 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 #B4D5E8 as 0% and #5C89B4 as 100%.

0.0%	0.0% #B4D5E8	RGB 180 213 232	#B4D5E8
16.7%	16.7% #A5C8DF	RGB 165 200 223	#A5C8DF
33.3%	33.3% #96BBD6	RGB 150 187 214	#96BBD6
50.0%	50.0% #88AFCE	RGB 136 175 206	#88AFCE
66.7%	66.7% #79A2C5	RGB 121 162 197	#79A2C5
83.3%	83.3% #6A95BC	RGB 106 149 188	#6A95BC
100.0%	100.0% #5C89B4	RGB 92 137 180	#5C89B4

#B4D5E8 #A5C8DF #96BBD6 #88AFCE #79A2C5 #6A95BC #5C89B4

#B4D5E8 - #5C89B4

HSV Blend

#B4D5E8 - #5C89B4 | 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 #B4D5E8 as 0% and #5C89B4 as 100%.

0.0%	0.0% #B4D5E8	RGB 180 213 232	#B4D5E8
16.7%	16.7% #A3C8DF	RGB 163 200 223	#A3C8DF
33.3%	33.3% #93BBD6	RGB 147 187 214	#93BBD6
50.0%	50.0% #84AECE	RGB 132 174 206	#84AECE
66.7%	66.7% #76A1C5	RGB 118 161 197	#76A1C5
83.3%	83.3% #6895BC	RGB 104 149 188	#6895BC
100.0%	100.0% #5C89B4	RGB 92 137 180	#5C89B4

#B4D5E8 #A3C8DF #93BBD6 #84AECE #76A1C5 #6895BC #5C89B4

#B4D5E8 - #84AECE - #5C89B4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B4D5E8 0%, #84AECE 50%, #5C89B4 100%);
    background: -webkit-linear-gradient(top, #B4D5E8 0%, #84AECE 50%, #5C89B4 100%);
    background: linear-gradient(to bottom, #B4D5E8 0%, #84AECE 50%, #5C89B4 100%);
}
</style>