#FFDCDC - #F2FFF2 | 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 #FFDCDC to #F2FFF2

#FFDCDC #F2FFF2

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

#FFDCDC - #F2FFF2 | 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 #FFDCDC as 0% and #F2FFF2 as 100%.

0.0%	0.0% #FFDCDC	RGB 255 220 220	#FFDCDC
16.7%	16.7% #FCE1DF	RGB 252 225 223	#FCE1DF
33.3%	33.3% #FAE7E3	RGB 250 231 227	#FAE7E3
50.0%	50.0% #F8EDE7	RGB 248 237 231	#F8EDE7
66.7%	66.7% #F6F3EA	RGB 246 243 234	#F6F3EA
83.3%	83.3% #F4F9EE	RGB 244 249 238	#F4F9EE
100.0%	100.0% #F2FFF2	RGB 242 255 242	#F2FFF2

#FFDCDC #FCE1DF #FAE7E3 #F8EDE7 #F6F3EA #F4F9EE #F2FFF2

#FFDCDC - #F2FFF2

HSV Blend

#FFDCDC - #F2FFF2 | 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 #FFDCDC as 0% and #F2FFF2 as 100%.

0.0%	0.0% #FFDCDC	RGB 255 220 220	#FFDCDC
16.7%	16.7% #FFEADF	RGB 255 234 223	#FFEADF
33.3%	33.3% #FFF5E3	RGB 255 245 227	#FFF5E3
50.0%	50.0% #FFFFE7	RGB 255 255 231	#FFFFE7
66.7%	66.7% #F8FFEA	RGB 248 255 234	#F8FFEA
83.3%	83.3% #F3FFEE	RGB 243 255 238	#F3FFEE
100.0%	100.0% #F2FFF2	RGB 242 255 242	#F2FFF2

#FFDCDC #FFEADF #FFF5E3 #FFFFE7 #F8FFEA #F3FFEE #F2FFF2

#FFDCDC - #FFFFE7 - #F2FFF2

CSS codes

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

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