#006097 - #6CBED2 | 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 #006097 to #6CBED2

#006097 #6CBED2

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

#006097 - #6CBED2 | 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 #006097 as 0% and #6CBED2 as 100%.

0.0%	0.0% #006097	RGB 0 96 151	#006097
16.7%	16.7% #126FA0	RGB 18 111 160	#126FA0
33.3%	33.3% #247FAA	RGB 36 127 170	#247FAA
50.0%	50.0% #368FB4	RGB 54 143 180	#368FB4
66.7%	66.7% #489EBE	RGB 72 158 190	#489EBE
83.3%	83.3% #5AAEC8	RGB 90 174 200	#5AAEC8
100.0%	100.0% #6CBED2	RGB 108 190 210	#6CBED2

#006097 #126FA0 #247FAA #368FB4 #489EBE #5AAEC8 #6CBED2

#006097 - #6CBED2

HSV Blend

#006097 - #6CBED2 | 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 #006097 as 0% and #6CBED2 as 100%.

0.0%	0.0% #006097	RGB 0 96 151	#006097
16.7%	16.7% #0D6FA0	RGB 13 111 160	#0D6FA0
33.3%	33.3% #1D7FAA	RGB 29 127 170	#1D7FAA
50.0%	50.0% #2E8EB4	RGB 46 142 180	#2E8EB4
66.7%	66.7% #419EBE	RGB 65 158 190	#419EBE
83.3%	83.3% #55AEC8	RGB 85 174 200	#55AEC8
100.0%	100.0% #6CBED2	RGB 108 190 210	#6CBED2

#006097 #0D6FA0 #1D7FAA #2E8EB4 #419EBE #55AEC8 #6CBED2

#006097 - #2E8EB4 - #6CBED2

CSS codes

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

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