#0C7ECE - #7AD4EC | 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 #0C7ECE to #7AD4EC

#0C7ECE #7AD4EC

Calculate the color between two colors, #0C7ECE and #7AD4EC. 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)

#0C7ECE - #7AD4EC | 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 #0C7ECE as 0% and #7AD4EC as 100%.

0.0%	0.0% #0C7ECE	RGB 12 126 206	#0C7ECE
16.7%	16.7% #1E8CD3	RGB 30 140 211	#1E8CD3
33.3%	33.3% #309AD8	RGB 48 154 216	#309AD8
50.0%	50.0% #43A9DD	RGB 67 169 221	#43A9DD
66.7%	66.7% #55B7E2	RGB 85 183 226	#55B7E2
83.3%	83.3% #67C5E7	RGB 103 197 231	#67C5E7
100.0%	100.0% #7AD4EC	RGB 122 212 236	#7AD4EC

#0C7ECE #1E8CD3 #309AD8 #43A9DD #55B7E2 #67C5E7 #7AD4EC

#0C7ECE - #7AD4EC

HSV Blend

#0C7ECE - #7AD4EC | 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 #0C7ECE as 0% and #7AD4EC as 100%.

0.0%	0.0% #0C7ECE	RGB 12 126 206	#0C7ECE
16.7%	16.7% #1C8DD3	RGB 28 141 211	#1C8DD3
33.3%	33.3% #2D9DD8	RGB 45 157 216	#2D9DD8
50.0%	50.0% #3FABDD	RGB 63 171 221	#3FABDD
66.7%	66.7% #52BAE2	RGB 82 186 226	#52BAE2
83.3%	83.3% #65C7E7	RGB 101 199 231	#65C7E7
100.0%	100.0% #7AD4EC	RGB 122 212 236	#7AD4EC

#0C7ECE #1C8DD3 #2D9DD8 #3FABDD #52BAE2 #65C7E7 #7AD4EC

#0C7ECE - #3FABDD - #7AD4EC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0C7ECE 0%, #3FABDD 50%, #7AD4EC 100%);
    background: -webkit-linear-gradient(top, #0C7ECE 0%, #3FABDD 50%, #7AD4EC 100%);
    background: linear-gradient(to bottom, #0C7ECE 0%, #3FABDD 50%, #7AD4EC 100%);
}
</style>