#3A8DC8 - #C6DEEF | 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 #3A8DC8 to #C6DEEF

#3A8DC8 #C6DEEF

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

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

0.0%	0.0% #3A8DC8	RGB 58 141 200	#3A8DC8
16.7%	16.7% #519ACE	RGB 81 154 206	#519ACE
33.3%	33.3% #68A8D5	RGB 104 168 213	#68A8D5
50.0%	50.0% #80B5DB	RGB 128 181 219	#80B5DB
66.7%	66.7% #97C3E2	RGB 151 195 226	#97C3E2
83.3%	83.3% #AED0E8	RGB 174 208 232	#AED0E8
100.0%	100.0% #C6DEEF	RGB 198 222 239	#C6DEEF

#3A8DC8 #519ACE #68A8D5 #80B5DB #97C3E2 #AED0E8 #C6DEEF

#3A8DC8 - #C6DEEF

HSV Blend

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

0.0%	0.0% #3A8CC8	RGB 58 140 200	#3A8CC8
16.7%	16.7% #4E99CE	RGB 78 153 206	#4E99CE
33.3%	33.3% #64A6D5	RGB 100 166 213	#64A6D5
50.0%	50.0% #7AB3DB	RGB 122 179 219	#7AB3DB
66.7%	66.7% #92C1E2	RGB 146 193 226	#92C1E2
83.3%	83.3% #ABCFE8	RGB 171 207 232	#ABCFE8
100.0%	100.0% #C6DEEF	RGB 198 222 239	#C6DEEF

#3A8CC8 #4E99CE #64A6D5 #7AB3DB #92C1E2 #ABCFE8 #C6DEEF

#3A8DC8 - #7AB3DB - #C6DEEF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3A8CC8 0%, #7AB3DB 50%, #C6DEEF 100%);
    background: -webkit-linear-gradient(top, #3A8CC8 0%, #7AB3DB 50%, #C6DEEF 100%);
    background: linear-gradient(to bottom, #3A8CC8 0%, #7AB3DB 50%, #C6DEEF 100%);
}
</style>