#3C569B - #8DA1C3 | 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 #3C569B to #8DA1C3

#3C569B #8DA1C3

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

#3C569B - #8DA1C3 | 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 #3C569B as 0% and #8DA1C3 as 100%.

0.0%	0.0% #3C569B	RGB 60 86 155	#3C569B
16.7%	16.7% #4962A1	RGB 73 98 161	#4962A1
33.3%	33.3% #576FA8	RGB 87 111 168	#576FA8
50.0%	50.0% #647BAF	RGB 100 123 175	#647BAF
66.7%	66.7% #7288B5	RGB 114 136 181	#7288B5
83.3%	83.3% #7F94BC	RGB 127 148 188	#7F94BC
100.0%	100.0% #8DA1C3	RGB 141 161 195	#8DA1C3

#3C569B #4962A1 #576FA8 #647BAF #7288B5 #7F94BC #8DA1C3

#3C569B - #8DA1C3

HSV Blend

#3C569B - #8DA1C3 | 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 #3C569B as 0% and #8DA1C3 as 100%.

0.0%	0.0% #3C569B	RGB 60 86 155	#3C569B
16.7%	16.7% #4761A1	RGB 71 97 161	#4761A1
33.3%	33.3% #546DA8	RGB 84 109 168	#546DA8
50.0%	50.0% #617AAF	RGB 97 122 175	#617AAF
66.7%	66.7% #6F86B5	RGB 111 134 181	#6F86B5
83.3%	83.3% #7D93BC	RGB 125 147 188	#7D93BC
100.0%	100.0% #8DA1C3	RGB 141 161 195	#8DA1C3

#3C569B #4761A1 #546DA8 #617AAF #6F86B5 #7D93BC #8DA1C3

#3C569B - #617AAF - #8DA1C3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C569B 0%, #617AAF 50%, #8DA1C3 100%);
    background: -webkit-linear-gradient(top, #3C569B 0%, #617AAF 50%, #8DA1C3 100%);
    background: linear-gradient(to bottom, #3C569B 0%, #617AAF 50%, #8DA1C3 100%);
}
</style>