#00A2FF - #003FFF | 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 #00A2FF to #003FFF

#00A2FF #003FFF

Calculate the color between two colors, #00A2FF and #003FFF. 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)

#00A2FF - #003FFF | 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 #00A2FF as 0% and #003FFF as 100%.

0.0%	0.0% #00A2FF	RGB 0 162 255	#00A2FF
16.7%	16.7% #0091FF	RGB 0 145 255	#0091FF
33.3%	33.3% #0081FF	RGB 0 129 255	#0081FF
50.0%	50.0% #0070FF	RGB 0 112 255	#0070FF
66.7%	66.7% #0060FF	RGB 0 96 255	#0060FF
83.3%	83.3% #004FFF	RGB 0 79 255	#004FFF
100.0%	100.0% #003FFF	RGB 0 63 255	#003FFF

#00A2FF #0091FF #0081FF #0070FF #0060FF #004FFF #003FFF

#00A2FF - #003FFF

HSV Blend

#00A2FF - #003FFF | 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 #00A2FF as 0% and #003FFF as 100%.

0.0%	0.0% #00A1FF	RGB 0 161 255	#00A1FF
16.7%	16.7% #0091FF	RGB 0 145 255	#0091FF
33.3%	33.3% #0081FF	RGB 0 129 255	#0081FF
50.0%	50.0% #0070FF	RGB 0 112 255	#0070FF
66.7%	66.7% #005FFF	RGB 0 95 255	#005FFF
83.3%	83.3% #004FFF	RGB 0 79 255	#004FFF
100.0%	100.0% #003FFF	RGB 0 63 255	#003FFF

#00A1FF #0091FF #0081FF #0070FF #005FFF #004FFF #003FFF

#00A2FF - #0070FF - #003FFF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00A1FF 0%, #0070FF 50%, #003FFF 100%);
    background: -webkit-linear-gradient(top, #00A1FF 0%, #0070FF 50%, #003FFF 100%);
    background: linear-gradient(to bottom, #00A1FF 0%, #0070FF 50%, #003FFF 100%);
}
</style>