#3C4EDB - #6BA2FF | 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 #3C4EDB to #6BA2FF

#3C4EDB #6BA2FF

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

#3C4EDB - #6BA2FF | 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 #3C4EDB as 0% and #6BA2FF as 100%.

0.0%	0.0% #3C4EDB	RGB 60 78 219	#3C4EDB
16.7%	16.7% #435CE1	RGB 67 92 225	#435CE1
33.3%	33.3% #4B6AE7	RGB 75 106 231	#4B6AE7
50.0%	50.0% #5378ED	RGB 83 120 237	#5378ED
66.7%	66.7% #5B86F3	RGB 91 134 243	#5B86F3
83.3%	83.3% #6394F9	RGB 99 148 249	#6394F9
100.0%	100.0% #6BA2FF	RGB 107 162 255	#6BA2FF

#3C4EDB #435CE1 #4B6AE7 #5378ED #5B86F3 #6394F9 #6BA2FF

#3C4EDB - #6BA2FF

HSV Blend

#3C4EDB - #6BA2FF | 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 #3C4EDB as 0% and #6BA2FF as 100%.

0.0%	0.0% #3B4EDB	RGB 59 78 219	#3B4EDB
16.7%	16.7% #435BE1	RGB 67 91 225	#435BE1
33.3%	33.3% #4A69E7	RGB 74 105 231	#4A69E7
50.0%	50.0% #5277ED	RGB 82 119 237	#5277ED
66.7%	66.7% #5A85F3	RGB 90 133 243	#5A85F3
83.3%	83.3% #6293F9	RGB 98 147 249	#6293F9
100.0%	100.0% #6BA2FF	RGB 107 162 255	#6BA2FF

#3B4EDB #435BE1 #4A69E7 #5277ED #5A85F3 #6293F9 #6BA2FF

#3C4EDB - #5277ED - #6BA2FF

CSS codes

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

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