#A2BBCE - #4D8BAF | 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 #A2BBCE to #4D8BAF

#A2BBCE #4D8BAF

Calculate the color between two colors, #A2BBCE and #4D8BAF. 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)

#A2BBCE - #4D8BAF | 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 #A2BBCE as 0% and #4D8BAF as 100%.

0.0%	0.0% #A2BBCE	RGB 162 187 206	#A2BBCE
16.7%	16.7% #93B3C8	RGB 147 179 200	#93B3C8
33.3%	33.3% #85ABC3	RGB 133 171 195	#85ABC3
50.0%	50.0% #77A3BE	RGB 119 163 190	#77A3BE
66.7%	66.7% #699BB9	RGB 105 155 185	#699BB9
83.3%	83.3% #5B93B4	RGB 91 147 180	#5B93B4
100.0%	100.0% #4D8BAF	RGB 77 139 175	#4D8BAF

#A2BBCE #93B3C8 #85ABC3 #77A3BE #699BB9 #5B93B4 #4D8BAF

#A2BBCE - #4D8BAF

HSV Blend

#A2BBCE - #4D8BAF | 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 #A2BBCE as 0% and #4D8BAF as 100%.

0.0%	0.0% #A2BBCE	RGB 162 187 206	#A2BBCE
16.7%	16.7% #92B1C8	RGB 146 177 200	#92B1C8
33.3%	33.3% #83A9C3	RGB 131 169 195	#83A9C3
50.0%	50.0% #74A1BE	RGB 116 161 190	#74A1BE
66.7%	66.7% #6699B9	RGB 102 153 185	#6699B9
83.3%	83.3% #5991B4	RGB 89 145 180	#5991B4
100.0%	100.0% #4D8BAF	RGB 77 139 175	#4D8BAF

#A2BBCE #92B1C8 #83A9C3 #74A1BE #6699B9 #5991B4 #4D8BAF

#A2BBCE - #74A1BE - #4D8BAF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A2BBCE 0%, #74A1BE 50%, #4D8BAF 100%);
    background: -webkit-linear-gradient(top, #A2BBCE 0%, #74A1BE 50%, #4D8BAF 100%);
    background: linear-gradient(to bottom, #A2BBCE 0%, #74A1BE 50%, #4D8BAF 100%);
}
</style>