#6DCCEB - #0084B2 | 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 #6DCCEB to #0084B2

#6DCCEB #0084B2

Calculate the color between two colors, #6DCCEB and #0084B2. 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)

#6DCCEB - #0084B2 | 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 #6DCCEB as 0% and #0084B2 as 100%.

0.0%	0.0% #6DCCEB	RGB 109 204 235	#6DCCEB
16.7%	16.7% #5AC0E1	RGB 90 192 225	#5AC0E1
33.3%	33.3% #48B4D8	RGB 72 180 216	#48B4D8
50.0%	50.0% #36A8CE	RGB 54 168 206	#36A8CE
66.7%	66.7% #249CC5	RGB 36 156 197	#249CC5
83.3%	83.3% #1290BB	RGB 18 144 187	#1290BB
100.0%	100.0% #0084B2	RGB 0 132 178	#0084B2

#6DCCEB #5AC0E1 #48B4D8 #36A8CE #249CC5 #1290BB #0084B2

#6DCCEB - #0084B2

HSV Blend

#6DCCEB - #0084B2 | 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 #6DCCEB as 0% and #0084B2 as 100%.

0.0%	0.0% #6DCCEB	RGB 109 204 235	#6DCCEB
16.7%	16.7% #57BFE1	RGB 87 191 225	#57BFE1
33.3%	33.3% #42B2D8	RGB 66 178 216	#42B2D8
50.0%	50.0% #2FA6CE	RGB 47 166 206	#2FA6CE
66.7%	66.7% #1E9AC5	RGB 30 154 197	#1E9AC5
83.3%	83.3% #0E8FBB	RGB 14 143 187	#0E8FBB
100.0%	100.0% #0084B2	RGB 0 132 178	#0084B2

#6DCCEB #57BFE1 #42B2D8 #2FA6CE #1E9AC5 #0E8FBB #0084B2

#6DCCEB - #2FA6CE - #0084B2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6DCCEB 0%, #2FA6CE 50%, #0084B2 100%);
    background: -webkit-linear-gradient(top, #6DCCEB 0%, #2FA6CE 50%, #0084B2 100%);
    background: linear-gradient(to bottom, #6DCCEB 0%, #2FA6CE 50%, #0084B2 100%);
}
</style>