#7FD0FF - #0089CD | 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 #7FD0FF to #0089CD

#7FD0FF #0089CD

Calculate the color between two colors, #7FD0FF and #0089CD. 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)

#7FD0FF - #0089CD | 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 #7FD0FF as 0% and #0089CD as 100%.

0.0%	0.0% #7FD0FF	RGB 127 208 255	#7FD0FF
16.7%	16.7% #69C4F6	RGB 105 196 246	#69C4F6
33.3%	33.3% #54B8EE	RGB 84 184 238	#54B8EE
50.0%	50.0% #3FACE6	RGB 63 172 230	#3FACE6
66.7%	66.7% #2AA0DD	RGB 42 160 221	#2AA0DD
83.3%	83.3% #1594D5	RGB 21 148 213	#1594D5
100.0%	100.0% #0089CD	RGB 0 137 205	#0089CD

#7FD0FF #69C4F6 #54B8EE #3FACE6 #2AA0DD #1594D5 #0089CD

#7FD0FF - #0089CD

HSV Blend

#7FD0FF - #0089CD | 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 #7FD0FF as 0% and #0089CD as 100%.

0.0%	0.0% #7FD0FF	RGB 127 208 255	#7FD0FF
16.7%	16.7% #66C2F6	RGB 102 194 246	#66C2F6
33.3%	33.3% #4FB5EE	RGB 79 181 238	#4FB5EE
50.0%	50.0% #39A9E6	RGB 57 169 230	#39A9E6
66.7%	66.7% #249EDD	RGB 36 158 221	#249EDD
83.3%	83.3% #1193D5	RGB 17 147 213	#1193D5
100.0%	100.0% #0089CD	RGB 0 137 205	#0089CD

#7FD0FF #66C2F6 #4FB5EE #39A9E6 #249EDD #1193D5 #0089CD

#7FD0FF - #39A9E6 - #0089CD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7FD0FF 0%, #39A9E6 50%, #0089CD 100%);
    background: -webkit-linear-gradient(top, #7FD0FF 0%, #39A9E6 50%, #0089CD 100%);
    background: linear-gradient(to bottom, #7FD0FF 0%, #39A9E6 50%, #0089CD 100%);
}
</style>