#ABABCB - #BEDFD2 | 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 #ABABCB to #BEDFD2

#ABABCB #BEDFD2

Calculate the color between two colors, #ABABCB and #BEDFD2. 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)

#ABABCB - #BEDFD2 | 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 #ABABCB as 0% and #BEDFD2 as 100%.

0.0%	0.0% #ABABCB	RGB 171 171 203	#ABABCB
16.7%	16.7% #AEB3CC	RGB 174 179 204	#AEB3CC
33.3%	33.3% #B1BCCD	RGB 177 188 205	#B1BCCD
50.0%	50.0% #B4C5CE	RGB 180 197 206	#B4C5CE
66.7%	66.7% #B7CDCF	RGB 183 205 207	#B7CDCF
83.3%	83.3% #BAD6D0	RGB 186 214 208	#BAD6D0
100.0%	100.0% #BEDFD2	RGB 190 223 210	#BEDFD2

#ABABCB #AEB3CC #B1BCCD #B4C5CE #B7CDCF #BAD6D0 #BEDFD2

#ABABCB - #BEDFD2

HSV Blend

#ABABCB - #BEDFD2 | 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 #ABABCB as 0% and #BEDFD2 as 100%.

0.0%	0.0% #ABABCB	RGB 171 171 203	#ABABCB
16.7%	16.7% #AEB5CE	RGB 174 181 206	#AEB5CE
33.3%	33.3% #B1C0D1	RGB 177 192 209	#B1C0D1
50.0%	50.0% #B4CBD5	RGB 180 203 213	#B4CBD5
66.7%	66.7% #B7D6D8	RGB 183 214 216	#B7D6D8
83.3%	83.3% #BADBD6	RGB 186 219 214	#BADBD6
100.0%	100.0% #BEDFD2	RGB 190 223 210	#BEDFD2

#ABABCB #AEB5CE #B1C0D1 #B4CBD5 #B7D6D8 #BADBD6 #BEDFD2

#ABABCB - #B4CBD5 - #BEDFD2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ABABCB 0%, #B4CBD5 50%, #BEDFD2 100%);
    background: -webkit-linear-gradient(top, #ABABCB 0%, #B4CBD5 50%, #BEDFD2 100%);
    background: linear-gradient(to bottom, #ABABCB 0%, #B4CBD5 50%, #BEDFD2 100%);
}
</style>