#0064A8 - #69C2DE | 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 #0064A8 to #69C2DE

#0064A8 #69C2DE

Calculate the color between two colors, #0064A8 and #69C2DE. 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)

#0064A8 - #69C2DE | 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 #0064A8 as 0% and #69C2DE as 100%.

0.0%	0.0% #0064A8	RGB 0 100 168	#0064A8
16.7%	16.7% #1173B1	RGB 17 115 177	#1173B1
33.3%	33.3% #2383BA	RGB 35 131 186	#2383BA
50.0%	50.0% #3493C3	RGB 52 147 195	#3493C3
66.7%	66.7% #46A2CC	RGB 70 162 204	#46A2CC
83.3%	83.3% #57B2D5	RGB 87 178 213	#57B2D5
100.0%	100.0% #69C2DE	RGB 105 194 222	#69C2DE

#0064A8 #1173B1 #2383BA #3493C3 #46A2CC #57B2D5 #69C2DE

#0064A8 - #69C2DE

HSV Blend

#0064A8 - #69C2DE | 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 #0064A8 as 0% and #69C2DE as 100%.

0.0%	0.0% #0064A8	RGB 0 100 168	#0064A8
16.7%	16.7% #0D73B1	RGB 13 115 177	#0D73B1
33.3%	33.3% #1D83BA	RGB 29 131 186	#1D83BA
50.0%	50.0% #2E93C3	RGB 46 147 195	#2E93C3
66.7%	66.7% #40A2CC	RGB 64 162 204	#40A2CC
83.3%	83.3% #53B2D5	RGB 83 178 213	#53B2D5
100.0%	100.0% #69C2DE	RGB 105 194 222	#69C2DE

#0064A8 #0D73B1 #1D83BA #2E93C3 #40A2CC #53B2D5 #69C2DE

#0064A8 - #2E93C3 - #69C2DE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0064A8 0%, #2E93C3 50%, #69C2DE 100%);
    background: -webkit-linear-gradient(top, #0064A8 0%, #2E93C3 50%, #69C2DE 100%);
    background: linear-gradient(to bottom, #0064A8 0%, #2E93C3 50%, #69C2DE 100%);
}
</style>