#7E3C82 - #682557 | colorate

colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。サイトをよりよくする

Blend #7E3C82 to #682557

#7E3C82

#682557

#7E3C82と#682557の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。

RGBブレンド

RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#7E3C82を0%、#682557を100%として二色間の色を展開します。

0.0%	0.0% #7E3C82	RGB 126 60 130	#7E3C82
16.7%	16.7% #7B397B	RGB 123 57 123	#7B397B
33.3%	33.3% #773574	RGB 119 53 116	#773574
50.0%	50.0% #73316D	RGB 115 49 109	#73316D
66.7%	66.7% #702D66	RGB 112 45 102	#702D66
83.3%	83.3% #6C295F	RGB 108 41 95	#6C295F
100.0%	100.0% #682557	RGB 104 37 87	#682557

#7E3C82 #7B397B #773574 #73316D #702D66 #6C295F #682557

#7E3C82 - #682557

HSVブレンド

HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#7E3C82を0%、#682557を100%として二色間の色を展開します。

0.0%	0.0% #7E3C82	RGB 126 60 130	#7E3C82
16.7%	16.7% #7D377D	RGB 125 55 125	#7D377D
33.3%	33.3% #793376	RGB 121 51 118	#793376
50.0%	50.0% #752F6E	RGB 117 47 110	#752F6E
66.7%	66.7% #702C66	RGB 112 44 102	#702C66
83.3%	83.3% #6C285E	RGB 108 40 94	#6C285E
100.0%	100.0% #682556	RGB 104 37 86	#682556

#7E3C82 #7D377D #793376 #752F6E #702C66 #6C285E #682556

#7E3C82 - #752F6E - #682556

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #7E3C82 0%, #752F6E 50%, #682556 100%);
    background: -webkit-linear-gradient(top, #7E3C82 0%, #752F6E 50%, #682556 100%);
    background: linear-gradient(to bottom, #7E3C82 0%, #752F6E 50%, #682556 100%); 
}
</style>