#454B5E - #6C7BD0 | 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 #454B5E to #6C7BD0

#454B5E #6C7BD0

Calculate the color between two colors, #454B5E and #6C7BD0. 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)

#454B5E - #6C7BD0 | 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 #454B5E as 0% and #6C7BD0 as 100%.

0.0%	0.0% #454B5E	RGB 69 75 94	#454B5E
16.7%	16.7% #4B5371	RGB 75 83 113	#4B5371
33.3%	33.3% #525B84	RGB 82 91 132	#525B84
50.0%	50.0% #586397	RGB 88 99 151	#586397
66.7%	66.7% #5F6BAA	RGB 95 107 170	#5F6BAA
83.3%	83.3% #6573BD	RGB 101 115 189	#6573BD
100.0%	100.0% #6C7BD0	RGB 108 123 208	#6C7BD0

#454B5E #4B5371 #525B84 #586397 #5F6BAA #6573BD #6C7BD0

#454B5E - #6C7BD0

HSV Blend

#454B5E - #6C7BD0 | 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 #454B5E as 0% and #6C7BD0 as 100%.

0.0%	0.0% #454B5E	RGB 69 75 94	#454B5E
16.7%	16.7% #4E5671	RGB 78 86 113	#4E5671
33.3%	33.3% #576084	RGB 87 96 132	#576084
50.0%	50.0% #5E6997	RGB 94 105 151	#5E6997
66.7%	66.7% #6470AA	RGB 100 112 170	#6470AA
83.3%	83.3% #6876BD	RGB 104 118 189	#6876BD
100.0%	100.0% #6C7BD0	RGB 108 123 208	#6C7BD0

#454B5E #4E5671 #576084 #5E6997 #6470AA #6876BD #6C7BD0

#454B5E - #5E6997 - #6C7BD0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #454B5E 0%, #5E6997 50%, #6C7BD0 100%);
    background: -webkit-linear-gradient(top, #454B5E 0%, #5E6997 50%, #6C7BD0 100%);
    background: linear-gradient(to bottom, #454B5E 0%, #5E6997 50%, #6C7BD0 100%);
}
</style>