#0068A2 - #B6D3E4 | 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 #0068A2 to #B6D3E4

#0068A2 #B6D3E4

Calculate the color between two colors, #0068A2 and #B6D3E4. 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)

#0068A2 - #B6D3E4 | 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 #0068A2 as 0% and #B6D3E4 as 100%.

0.0%	0.0% #0068A2	RGB 0 104 162	#0068A2
16.7%	16.7% #1E79AD	RGB 30 121 173	#1E79AD
33.3%	33.3% #3C8BB8	RGB 60 139 184	#3C8BB8
50.0%	50.0% #5B9DC3	RGB 91 157 195	#5B9DC3
66.7%	66.7% #79AFCE	RGB 121 175 206	#79AFCE
83.3%	83.3% #97C1D9	RGB 151 193 217	#97C1D9
100.0%	100.0% #B6D3E4	RGB 182 211 228	#B6D3E4

#0068A2 #1E79AD #3C8BB8 #5B9DC3 #79AFCE #97C1D9 #B6D3E4

#0068A2 - #B6D3E4

HSV Blend

#0068A2 - #B6D3E4 | 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 #0068A2 as 0% and #B6D3E4 as 100%.

0.0%	0.0% #0067A2	RGB 0 103 162	#0067A2
16.7%	16.7% #1777AD	RGB 23 119 173	#1777AD
33.3%	33.3% #3087B8	RGB 48 135 184	#3087B8
50.0%	50.0% #4D98C3	RGB 77 152 195	#4D98C3
66.7%	66.7% #6DAACE	RGB 109 170 206	#6DAACE
83.3%	83.3% #90BED9	RGB 144 190 217	#90BED9
100.0%	100.0% #B6D3E4	RGB 182 211 228	#B6D3E4

#0067A2 #1777AD #3087B8 #4D98C3 #6DAACE #90BED9 #B6D3E4

#0068A2 - #4D98C3 - #B6D3E4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0067A2 0%, #4D98C3 50%, #B6D3E4 100%);
    background: -webkit-linear-gradient(top, #0067A2 0%, #4D98C3 50%, #B6D3E4 100%);
    background: linear-gradient(to bottom, #0067A2 0%, #4D98C3 50%, #B6D3E4 100%);
}
</style>