#2A2884 - #682490 | colorate

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

Blend #2A2884 to #682490

#2A2884

#682490

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

RGBブレンド

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

0.0%	0.0% #2A2884	RGB 42 40 132	#2A2884
16.7%	16.7% #342886	RGB 52 40 134	#342886
33.3%	33.3% #3E2788	RGB 62 39 136	#3E2788
50.0%	50.0% #49268A	RGB 73 38 138	#49268A
66.7%	66.7% #53268C	RGB 83 38 140	#53268C
83.3%	83.3% #5D258E	RGB 93 37 142	#5D258E
100.0%	100.0% #682490	RGB 104 36 144	#682490

#2A2884 #342886 #3E2788 #49268A #53268C #5D258E #682490

#2A2884 - #682490

HSVブレンド

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

0.0%	0.0% #2A2884	RGB 42 40 132	#2A2884
16.7%	16.7% #332786	RGB 51 39 134	#332786
33.3%	33.3% #3C2688	RGB 60 38 136	#3C2688
50.0%	50.0% #46268A	RGB 70 38 138	#46268A
66.7%	66.7% #51258C	RGB 81 37 140	#51258C
83.3%	83.3% #5C248E	RGB 92 36 142	#5C248E
100.0%	100.0% #682490	RGB 104 36 144	#682490

#2A2884 #332786 #3C2688 #46268A #51258C #5C248E #682490

#2A2884 - #46268A - #682490

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #2A2884 0%, #46268A 50%, #682490 100%);
    background: -webkit-linear-gradient(top, #2A2884 0%, #46268A 50%, #682490 100%);
    background: linear-gradient(to bottom, #2A2884 0%, #46268A 50%, #682490 100%); 
}
</style>