#5E81A0 - #7CB6FD | 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 #5E81A0 to #7CB6FD

#5E81A0 #7CB6FD

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

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

0.0%	0.0% #5E81A0	RGB 94 129 160	#5E81A0
16.7%	16.7% #6389AF	RGB 99 137 175	#6389AF
33.3%	33.3% #6892BF	RGB 104 146 191	#6892BF
50.0%	50.0% #6D9BCE	RGB 109 155 206	#6D9BCE
66.7%	66.7% #72A4DE	RGB 114 164 222	#72A4DE
83.3%	83.3% #77ADED	RGB 119 173 237	#77ADED
100.0%	100.0% #7CB6FD	RGB 124 182 253	#7CB6FD

#5E81A0 #6389AF #6892BF #6D9BCE #72A4DE #77ADED #7CB6FD

#5E81A0 - #7CB6FD

HSV Blend

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

0.0%	0.0% #5E81A0	RGB 94 129 160	#5E81A0
16.7%	16.7% #648BAF	RGB 100 139 175	#648BAF
33.3%	33.3% #6A94BF	RGB 106 148 191	#6A94BF
50.0%	50.0% #6F9DCE	RGB 111 157 206	#6F9DCE
66.7%	66.7% #74A6DE	RGB 116 166 222	#74A6DE
83.3%	83.3% #78AEED	RGB 120 174 237	#78AEED
100.0%	100.0% #7CB6FD	RGB 124 182 253	#7CB6FD

#5E81A0 #648BAF #6A94BF #6F9DCE #74A6DE #78AEED #7CB6FD

#5E81A0 - #6F9DCE - #7CB6FD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E81A0 0%, #6F9DCE 50%, #7CB6FD 100%);
    background: -webkit-linear-gradient(top, #5E81A0 0%, #6F9DCE 50%, #7CB6FD 100%);
    background: linear-gradient(to bottom, #5E81A0 0%, #6F9DCE 50%, #7CB6FD 100%);
}
</style>