#4A8D9A - #CBDEE2 | 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 #4A8D9A to #CBDEE2

#4A8D9A #CBDEE2

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

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

0.0%	0.0% #4A8D9A	RGB 74 141 154	#4A8D9A
16.7%	16.7% #5F9AA6	RGB 95 154 166	#5F9AA6
33.3%	33.3% #75A8B2	RGB 117 168 178	#75A8B2
50.0%	50.0% #8AB5BE	RGB 138 181 190	#8AB5BE
66.7%	66.7% #A0C3CA	RGB 160 195 202	#A0C3CA
83.3%	83.3% #B5D0D6	RGB 181 208 214	#B5D0D6
100.0%	100.0% #CBDEE2	RGB 203 222 226	#CBDEE2

#4A8D9A #5F9AA6 #75A8B2 #8AB5BE #A0C3CA #B5D0D6 #CBDEE2

#4A8D9A - #CBDEE2

HSV Blend

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

0.0%	0.0% #4A8D9A	RGB 74 141 154	#4A8D9A
16.7%	16.7% #5B99A6	RGB 91 153 166	#5B99A6
33.3%	33.3% #6EA6B2	RGB 110 166 178	#6EA6B2
50.0%	50.0% #82B4BE	RGB 130 180 190	#82B4BE
66.7%	66.7% #99C1CA	RGB 153 193 202	#99C1CA
83.3%	83.3% #B1CFD6	RGB 177 207 214	#B1CFD6
100.0%	100.0% #CBDEE2	RGB 203 222 226	#CBDEE2

#4A8D9A #5B99A6 #6EA6B2 #82B4BE #99C1CA #B1CFD6 #CBDEE2

#4A8D9A - #82B4BE - #CBDEE2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4A8D9A 0%, #82B4BE 50%, #CBDEE2 100%);
    background: -webkit-linear-gradient(top, #4A8D9A 0%, #82B4BE 50%, #CBDEE2 100%);
    background: linear-gradient(to bottom, #4A8D9A 0%, #82B4BE 50%, #CBDEE2 100%);
}
</style>