#8688A8 - #30425C | 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 #8688A8 to #30425C

#8688A8 #30425C

Calculate the color between two colors, #8688A8 and #30425C. 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)

#8688A8 - #30425C | 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 #8688A8 as 0% and #30425C as 100%.

0.0%	0.0% #8688A8	RGB 134 136 168	#8688A8
16.7%	16.7% #777C9B	RGB 119 124 155	#777C9B
33.3%	33.3% #69708E	RGB 105 112 142	#69708E
50.0%	50.0% #5B6582	RGB 91 101 130	#5B6582
66.7%	66.7% #4C5975	RGB 76 89 117	#4C5975
83.3%	83.3% #3E4D68	RGB 62 77 104	#3E4D68
100.0%	100.0% #30425C	RGB 48 66 92	#30425C

#8688A8 #777C9B #69708E #5B6582 #4C5975 #3E4D68 #30425C

#8688A8 - #30425C

HSV Blend

#8688A8 - #30425C | 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 #8688A8 as 0% and #30425C as 100%.

0.0%	0.0% #8688A8	RGB 134 136 168	#8688A8
16.7%	16.7% #74799B	RGB 116 121 155	#74799B
33.3%	33.3% #646C8E	RGB 100 108 142	#646C8E
50.0%	50.0% #556082	RGB 85 96 130	#556082
66.7%	66.7% #485575	RGB 72 85 117	#485575
83.3%	83.3% #3B4B68	RGB 59 75 104	#3B4B68
100.0%	100.0% #30425C	RGB 48 66 92	#30425C

#8688A8 #74799B #646C8E #556082 #485575 #3B4B68 #30425C

#8688A8 - #556082 - #30425C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8688A8 0%, #556082 50%, #30425C 100%);
    background: -webkit-linear-gradient(top, #8688A8 0%, #556082 50%, #30425C 100%);
    background: linear-gradient(to bottom, #8688A8 0%, #556082 50%, #30425C 100%);
}
</style>