#00679B - #3CC3E1 | 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 #00679B to #3CC3E1

#00679B #3CC3E1

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

#00679B - #3CC3E1 | 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 #00679B as 0% and #3CC3E1 as 100%.

0.0%	0.0% #00679B	RGB 0 103 155	#00679B
16.7%	16.7% #0A76A6	RGB 10 118 166	#0A76A6
33.3%	33.3% #1485B2	RGB 20 133 178	#1485B2
50.0%	50.0% #1E95BE	RGB 30 149 190	#1E95BE
66.7%	66.7% #28A4C9	RGB 40 164 201	#28A4C9
83.3%	83.3% #32B3D5	RGB 50 179 213	#32B3D5
100.0%	100.0% #3CC3E1	RGB 60 195 225	#3CC3E1

#00679B #0A76A6 #1485B2 #1E95BE #28A4C9 #32B3D5 #3CC3E1

#00679B - #3CC3E1

HSV Blend

#00679B - #3CC3E1 | 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 #00679B as 0% and #3CC3E1 as 100%.

0.0%	0.0% #00679B	RGB 0 103 155	#00679B
16.7%	16.7% #0775A6	RGB 7 117 166	#0775A6
33.3%	33.3% #0F84B2	RGB 15 132 178	#0F84B2
50.0%	50.0% #1993BE	RGB 25 147 190	#1993BE
66.7%	66.7% #23A3C9	RGB 35 163 201	#23A3C9
83.3%	83.3% #2FB2D5	RGB 47 178 213	#2FB2D5
100.0%	100.0% #3CC3E1	RGB 60 195 225	#3CC3E1

#00679B #0775A6 #0F84B2 #1993BE #23A3C9 #2FB2D5 #3CC3E1

#00679B - #1993BE - #3CC3E1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00679B 0%, #1993BE 50%, #3CC3E1 100%);
    background: -webkit-linear-gradient(top, #00679B 0%, #1993BE 50%, #3CC3E1 100%);
    background: linear-gradient(to bottom, #00679B 0%, #1993BE 50%, #3CC3E1 100%);
}
</style>