#3C82BE - #A8EDA8 | 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 #3C82BE to #A8EDA8

#3C82BE #A8EDA8

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

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

0.0%	0.0% #3C82BE	RGB 60 130 190	#3C82BE
16.7%	16.7% #4E93BA	RGB 78 147 186	#4E93BA
33.3%	33.3% #60A5B6	RGB 96 165 182	#60A5B6
50.0%	50.0% #72B7B3	RGB 114 183 179	#72B7B3
66.7%	66.7% #84C9AF	RGB 132 201 175	#84C9AF
83.3%	83.3% #96DBAB	RGB 150 219 171	#96DBAB
100.0%	100.0% #A8EDA8	RGB 168 237 168	#A8EDA8

#3C82BE #4E93BA #60A5B6 #72B7B3 #84C9AF #96DBAB #A8EDA8

#3C82BE - #A8EDA8

HSV Blend

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

0.0%	0.0% #3C82BE	RGB 60 130 190	#3C82BE
16.7%	16.7% #4BABC5	RGB 75 171 197	#4BABC5
33.3%	33.3% #5BCDCA	RGB 91 205 202	#5BCDCA
50.0%	50.0% #6DD5B9	RGB 109 213 185	#6DD5B9
66.7%	66.7% #7FDDAD	RGB 127 221 173	#7FDDAD
83.3%	83.3% #93E5A7	RGB 147 229 167	#93E5A7
100.0%	100.0% #A8EDA8	RGB 168 237 168	#A8EDA8

#3C82BE #4BABC5 #5BCDCA #6DD5B9 #7FDDAD #93E5A7 #A8EDA8

#3C82BE - #6DD5B9 - #A8EDA8

CSS codes

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

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