#AFB9CF - #546A8F | 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 #AFB9CF to #546A8F

#AFB9CF #546A8F

Calculate the color between two colors, #AFB9CF and #546A8F. 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)

#AFB9CF - #546A8F | 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 #AFB9CF as 0% and #546A8F as 100%.

0.0%	0.0% #AFB9CF	RGB 175 185 207	#AFB9CF
16.7%	16.7% #9FABC4	RGB 159 171 196	#9FABC4
33.3%	33.3% #909EB9	RGB 144 158 185	#909EB9
50.0%	50.0% #8191AF	RGB 129 145 175	#8191AF
66.7%	66.7% #7284A4	RGB 114 132 164	#7284A4
83.3%	83.3% #637799	RGB 99 119 153	#637799
100.0%	100.0% #546A8F	RGB 84 106 143	#546A8F

#AFB9CF #9FABC4 #909EB9 #8191AF #7284A4 #637799 #546A8F

#AFB9CF - #546A8F

HSV Blend

#AFB9CF - #546A8F | 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 #AFB9CF as 0% and #546A8F as 100%.

0.0%	0.0% #AFB9CF	RGB 175 185 207	#AFB9CF
16.7%	16.7% #9DAAC4	RGB 157 170 196	#9DAAC4
33.3%	33.3% #8C9BB9	RGB 140 155 185	#8C9BB9
50.0%	50.0% #7D8EAF	RGB 125 142 175	#7D8EAF
66.7%	66.7% #6E81A4	RGB 110 129 164	#6E81A4
83.3%	83.3% #607599	RGB 96 117 153	#607599
100.0%	100.0% #546A8F	RGB 84 106 143	#546A8F

#AFB9CF #9DAAC4 #8C9BB9 #7D8EAF #6E81A4 #607599 #546A8F

#AFB9CF - #7D8EAF - #546A8F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFB9CF 0%, #7D8EAF 50%, #546A8F 100%);
    background: -webkit-linear-gradient(top, #AFB9CF 0%, #7D8EAF 50%, #546A8F 100%);
    background: linear-gradient(to bottom, #AFB9CF 0%, #7D8EAF 50%, #546A8F 100%);
}
</style>