#7BDAB0 - #CDDAFB | 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 #7BDAB0 to #CDDAFB

#7BDAB0 #CDDAFB

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

#7BDAB0 - #CDDAFB | 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 #7BDAB0 as 0% and #CDDAFB as 100%.

0.0%	0.0% #7BDAB0	RGB 123 218 176	#7BDAB0
16.7%	16.7% #88DABC	RGB 136 218 188	#88DABC
33.3%	33.3% #96DAC9	RGB 150 218 201	#96DAC9
50.0%	50.0% #A4DAD5	RGB 164 218 213	#A4DAD5
66.7%	66.7% #B1DAE2	RGB 177 218 226	#B1DAE2
83.3%	83.3% #BFDAEE	RGB 191 218 238	#BFDAEE
100.0%	100.0% #CDDAFB	RGB 205 218 251	#CDDAFB

#7BDAB0 #88DABC #96DAC9 #A4DAD5 #B1DAE2 #BFDAEE #CDDAFB

#7BDAB0 - #CDDAFB

HSV Blend

#7BDAB0 - #CDDAFB | 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 #7BDAB0 as 0% and #CDDAFB as 100%.

0.0%	0.0% #7BDAB0	RGB 123 218 176	#7BDAB0
16.7%	16.7% #87DFC9	RGB 135 223 201	#87DFC9
33.3%	33.3% #94E5E0	RGB 148 229 224	#94E5E0
50.0%	50.0% #A1E0EA	RGB 161 224 234	#A1E0EA
66.7%	66.7% #AFDAF0	RGB 175 218 240	#AFDAF0
83.3%	83.3% #BED8F5	RGB 190 216 245	#BED8F5
100.0%	100.0% #CDDAFB	RGB 205 218 251	#CDDAFB

#7BDAB0 #87DFC9 #94E5E0 #A1E0EA #AFDAF0 #BED8F5 #CDDAFB

#7BDAB0 - #A1E0EA - #CDDAFB

CSS codes

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

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