#A8CDF3 - #3A73BB | 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 #A8CDF3 to #3A73BB

#A8CDF3 #3A73BB

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

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

0.0%	0.0% #A8CDF3	RGB 168 205 243	#A8CDF3
16.7%	16.7% #95BEE9	RGB 149 190 233	#95BEE9
33.3%	33.3% #83AFE0	RGB 131 175 224	#83AFE0
50.0%	50.0% #71A0D7	RGB 113 160 215	#71A0D7
66.7%	66.7% #5E91CD	RGB 94 145 205	#5E91CD
83.3%	83.3% #4C82C4	RGB 76 130 196	#4C82C4
100.0%	100.0% #3A73BB	RGB 58 115 187	#3A73BB

#A8CDF3 #95BEE9 #83AFE0 #71A0D7 #5E91CD #4C82C4 #3A73BB

#A8CDF3 - #3A73BB

HSV Blend

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

0.0%	0.0% #A8CDF3	RGB 168 205 243	#A8CDF3
16.7%	16.7% #92BCE9	RGB 146 188 233	#92BCE9
33.3%	33.3% #7EADE0	RGB 126 173 224	#7EADE0
50.0%	50.0% #6B9DD7	RGB 107 157 215	#6B9DD7
66.7%	66.7% #598FCD	RGB 89 143 205	#598FCD
83.3%	83.3% #4980C4	RGB 73 128 196	#4980C4
100.0%	100.0% #3A73BB	RGB 58 115 187	#3A73BB

#A8CDF3 #92BCE9 #7EADE0 #6B9DD7 #598FCD #4980C4 #3A73BB

#A8CDF3 - #6B9DD7 - #3A73BB

CSS codes

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

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