#525CFF - #71B0FF | 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 #525CFF to #71B0FF

#525CFF #71B0FF

Calculate the color between two colors, #525CFF and #71B0FF. 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)

#525CFF - #71B0FF | 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 #525CFF as 0% and #71B0FF as 100%.

0.0%	0.0% #525CFF	RGB 82 92 255	#525CFF
16.7%	16.7% #576AFF	RGB 87 106 255	#576AFF
33.3%	33.3% #5C78FF	RGB 92 120 255	#5C78FF
50.0%	50.0% #6186FF	RGB 97 134 255	#6186FF
66.7%	66.7% #6694FF	RGB 102 148 255	#6694FF
83.3%	83.3% #6BA2FF	RGB 107 162 255	#6BA2FF
100.0%	100.0% #71B0FF	RGB 113 176 255	#71B0FF

#525CFF #576AFF #5C78FF #6186FF #6694FF #6BA2FF #71B0FF

#525CFF - #71B0FF

HSV Blend

#525CFF - #71B0FF | 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 #525CFF as 0% and #71B0FF as 100%.

0.0%	0.0% #515CFF	RGB 81 92 255	#515CFF
16.7%	16.7% #576BFF	RGB 87 107 255	#576BFF
33.3%	33.3% #5C7AFF	RGB 92 122 255	#5C7AFF
50.0%	50.0% #6188FF	RGB 97 136 255	#6188FF
66.7%	66.7% #6696FF	RGB 102 150 255	#6696FF
83.3%	83.3% #6BA3FF	RGB 107 163 255	#6BA3FF
100.0%	100.0% #71B0FF	RGB 113 176 255	#71B0FF

#515CFF #576BFF #5C7AFF #6188FF #6696FF #6BA3FF #71B0FF

#525CFF - #6188FF - #71B0FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #515CFF 0%, #6188FF 50%, #71B0FF 100%);
    background: -webkit-linear-gradient(top, #515CFF 0%, #6188FF 50%, #71B0FF 100%);
    background: linear-gradient(to bottom, #515CFF 0%, #6188FF 50%, #71B0FF 100%);
}
</style>