#A8C2CC - #3C7E99 | 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 #A8C2CC to #3C7E99

#A8C2CC #3C7E99

Calculate the color between two colors, #A8C2CC and #3C7E99. 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)

#A8C2CC - #3C7E99 | 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 #A8C2CC as 0% and #3C7E99 as 100%.

0.0%	0.0% #A8C2CC	RGB 168 194 204	#A8C2CC
16.7%	16.7% #96B6C3	RGB 150 182 195	#96B6C3
33.3%	33.3% #84ABBB	RGB 132 171 187	#84ABBB
50.0%	50.0% #72A0B2	RGB 114 160 178	#72A0B2
66.7%	66.7% #6094AA	RGB 96 148 170	#6094AA
83.3%	83.3% #4E89A1	RGB 78 137 161	#4E89A1
100.0%	100.0% #3C7E99	RGB 60 126 153	#3C7E99

#A8C2CC #96B6C3 #84ABBB #72A0B2 #6094AA #4E89A1 #3C7E99

#A8C2CC - #3C7E99

HSV Blend

#A8C2CC - #3C7E99 | 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 #A8C2CC as 0% and #3C7E99 as 100%.

0.0%	0.0% #A8C2CC	RGB 168 194 204	#A8C2CC
16.7%	16.7% #92B5C3	RGB 146 181 195	#92B5C3
33.3%	33.3% #7FAABB	RGB 127 170 187	#7FAABB
50.0%	50.0% #6C9EB2	RGB 108 158 178	#6C9EB2
66.7%	66.7% #5B93AA	RGB 91 147 170	#5B93AA
83.3%	83.3% #4A88A1	RGB 74 136 161	#4A88A1
100.0%	100.0% #3C7E99	RGB 60 126 153	#3C7E99

#A8C2CC #92B5C3 #7FAABB #6C9EB2 #5B93AA #4A88A1 #3C7E99

#A8C2CC - #6C9EB2 - #3C7E99

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8C2CC 0%, #6C9EB2 50%, #3C7E99 100%);
    background: -webkit-linear-gradient(top, #A8C2CC 0%, #6C9EB2 50%, #3C7E99 100%);
    background: linear-gradient(to bottom, #A8C2CC 0%, #6C9EB2 50%, #3C7E99 100%);
}
</style>