#5E63B8 - #D1D2EA | 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 #5E63B8 to #D1D2EA

#5E63B8 #D1D2EA

Calculate the color between two colors, #5E63B8 and #D1D2EA. 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)

#5E63B8 - #D1D2EA | 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 #5E63B8 as 0% and #D1D2EA as 100%.

0.0%	0.0% #5E63B8	RGB 94 99 184	#5E63B8
16.7%	16.7% #7175C0	RGB 113 117 192	#7175C0
33.3%	33.3% #8488C8	RGB 132 136 200	#8488C8
50.0%	50.0% #979AD1	RGB 151 154 209	#979AD1
66.7%	66.7% #AAADD9	RGB 170 173 217	#AAADD9
83.3%	83.3% #BDBFE1	RGB 189 191 225	#BDBFE1
100.0%	100.0% #D1D2EA	RGB 209 210 234	#D1D2EA

#5E63B8 #7175C0 #8488C8 #979AD1 #AAADD9 #BDBFE1 #D1D2EA

#5E63B8 - #D1D2EA

HSV Blend

#5E63B8 - #D1D2EA | 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 #5E63B8 as 0% and #D1D2EA as 100%.

0.0%	0.0% #5E63B8	RGB 94 99 184	#5E63B8
16.7%	16.7% #6E72C0	RGB 110 114 192	#6E72C0
33.3%	33.3% #8083C8	RGB 128 131 200	#8083C8
50.0%	50.0% #9295D1	RGB 146 149 209	#9295D1
66.7%	66.7% #A6A8D9	RGB 166 168 217	#A6A8D9
83.3%	83.3% #BBBCE1	RGB 187 188 225	#BBBCE1
100.0%	100.0% #D1D2EA	RGB 209 210 234	#D1D2EA

#5E63B8 #6E72C0 #8083C8 #9295D1 #A6A8D9 #BBBCE1 #D1D2EA

#5E63B8 - #9295D1 - #D1D2EA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E63B8 0%, #9295D1 50%, #D1D2EA 100%);
    background: -webkit-linear-gradient(top, #5E63B8 0%, #9295D1 50%, #D1D2EA 100%);
    background: linear-gradient(to bottom, #5E63B8 0%, #9295D1 50%, #D1D2EA 100%);
}
</style>