#85D5E4 - #338CB2 | 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 #85D5E4 to #338CB2

#85D5E4 #338CB2

Calculate the color between two colors, #85D5E4 and #338CB2. 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)

#85D5E4 - #338CB2 | 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 #85D5E4 as 0% and #338CB2 as 100%.

0.0%	0.0% #85D5E4	RGB 133 213 228	#85D5E4
16.7%	16.7% #77C8DB	RGB 119 200 219	#77C8DB
33.3%	33.3% #69BCD3	RGB 105 188 211	#69BCD3
50.0%	50.0% #5CB0CB	RGB 92 176 203	#5CB0CB
66.7%	66.7% #4EA4C2	RGB 78 164 194	#4EA4C2
83.3%	83.3% #4098BA	RGB 64 152 186	#4098BA
100.0%	100.0% #338CB2	RGB 51 140 178	#338CB2

#85D5E4 #77C8DB #69BCD3 #5CB0CB #4EA4C2 #4098BA #338CB2

#85D5E4 - #338CB2

HSV Blend

#85D5E4 - #338CB2 | 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 #85D5E4 as 0% and #338CB2 as 100%.

0.0%	0.0% #85D5E4	RGB 133 213 228	#85D5E4
16.7%	16.7% #75C9DB	RGB 117 201 219	#75C9DB
33.3%	33.3% #66BCD3	RGB 102 188 211	#66BCD3
50.0%	50.0% #58B0CB	RGB 88 176 203	#58B0CB
66.7%	66.7% #4BA4C2	RGB 75 164 194	#4BA4C2
83.3%	83.3% #3E98BA	RGB 62 152 186	#3E98BA
100.0%	100.0% #338CB2	RGB 51 140 178	#338CB2

#85D5E4 #75C9DB #66BCD3 #58B0CB #4BA4C2 #3E98BA #338CB2

#85D5E4 - #58B0CB - #338CB2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #85D5E4 0%, #58B0CB 50%, #338CB2 100%);
    background: -webkit-linear-gradient(top, #85D5E4 0%, #58B0CB 50%, #338CB2 100%);
    background: linear-gradient(to bottom, #85D5E4 0%, #58B0CB 50%, #338CB2 100%);
}
</style>