#5E89F0 - #82D3FF | 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 #5E89F0 to #82D3FF

#5E89F0 #82D3FF

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

#5E89F0 - #82D3FF | 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 #5E89F0 as 0% and #82D3FF as 100%.

0.0%	0.0% #5E89F0	RGB 94 137 240	#5E89F0
16.7%	16.7% #6495F2	RGB 100 149 242	#6495F2
33.3%	33.3% #6AA1F5	RGB 106 161 245	#6AA1F5
50.0%	50.0% #70AEF7	RGB 112 174 247	#70AEF7
66.7%	66.7% #76BAFA	RGB 118 186 250	#76BAFA
83.3%	83.3% #7CC6FC	RGB 124 198 252	#7CC6FC
100.0%	100.0% #82D3FF	RGB 130 211 255	#82D3FF

#5E89F0 #6495F2 #6AA1F5 #70AEF7 #76BAFA #7CC6FC #82D3FF

#5E89F0 - #82D3FF

HSV Blend

#5E89F0 - #82D3FF | 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 #5E89F0 as 0% and #82D3FF as 100%.

0.0%	0.0% #5E88F0	RGB 94 136 240	#5E88F0
16.7%	16.7% #6396F2	RGB 99 150 242	#6396F2
33.3%	33.3% #69A3F5	RGB 105 163 245	#69A3F5
50.0%	50.0% #6FAFF7	RGB 111 175 247	#6FAFF7
66.7%	66.7% #75BBFA	RGB 117 187 250	#75BBFA
83.3%	83.3% #7BC7FC	RGB 123 199 252	#7BC7FC
100.0%	100.0% #82D3FF	RGB 130 211 255	#82D3FF

#5E88F0 #6396F2 #69A3F5 #6FAFF7 #75BBFA #7BC7FC #82D3FF

#5E89F0 - #6FAFF7 - #82D3FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E88F0 0%, #6FAFF7 50%, #82D3FF 100%);
    background: -webkit-linear-gradient(top, #5E88F0 0%, #6FAFF7 50%, #82D3FF 100%);
    background: linear-gradient(to bottom, #5E88F0 0%, #6FAFF7 50%, #82D3FF 100%);
}
</style>