#4B5FD5 - #84ADF0 | 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 #4B5FD5 to #84ADF0

#4B5FD5 #84ADF0

Calculate the color between two colors, #4B5FD5 and #84ADF0. 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)

#4B5FD5 - #84ADF0 | 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 #4B5FD5 as 0% and #84ADF0 as 100%.

0.0%	0.0% #4B5FD5	RGB 75 95 213	#4B5FD5
16.7%	16.7% #546CD9	RGB 84 108 217	#546CD9
33.3%	33.3% #5E79DE	RGB 94 121 222	#5E79DE
50.0%	50.0% #6786E2	RGB 103 134 226	#6786E2
66.7%	66.7% #7193E7	RGB 113 147 231	#7193E7
83.3%	83.3% #7AA0EB	RGB 122 160 235	#7AA0EB
100.0%	100.0% #84ADF0	RGB 132 173 240	#84ADF0

#4B5FD5 #546CD9 #5E79DE #6786E2 #7193E7 #7AA0EB #84ADF0

#4B5FD5 - #84ADF0

HSV Blend

#4B5FD5 - #84ADF0 | 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 #4B5FD5 as 0% and #84ADF0 as 100%.

0.0%	0.0% #4B5FD5	RGB 75 95 213	#4B5FD5
16.7%	16.7% #536CD9	RGB 83 108 217	#536CD9
33.3%	33.3% #5C79DE	RGB 92 121 222	#5C79DE
50.0%	50.0% #6686E2	RGB 102 134 226	#6686E2
66.7%	66.7% #6F93E7	RGB 111 147 231	#6F93E7
83.3%	83.3% #79A0EB	RGB 121 160 235	#79A0EB
100.0%	100.0% #84ADF0	RGB 132 173 240	#84ADF0

#4B5FD5 #536CD9 #5C79DE #6686E2 #6F93E7 #79A0EB #84ADF0

#4B5FD5 - #6686E2 - #84ADF0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4B5FD5 0%, #6686E2 50%, #84ADF0 100%);
    background: -webkit-linear-gradient(top, #4B5FD5 0%, #6686E2 50%, #84ADF0 100%);
    background: linear-gradient(to bottom, #4B5FD5 0%, #6686E2 50%, #84ADF0 100%);
}
</style>