#604731 - #796931 | colorate

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

Blend #604731 to #796931

#604731

#796931

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

RGBブレンド

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

0.0%	0.0% #604731	RGB 96 71 49	#604731
16.7%	16.7% #644C31	RGB 100 76 49	#644C31
33.3%	33.3% #685231	RGB 104 82 49	#685231
50.0%	50.0% #6C5831	RGB 108 88 49	#6C5831
66.7%	66.7% #705D31	RGB 112 93 49	#705D31
83.3%	83.3% #746331	RGB 116 99 49	#746331
100.0%	100.0% #796931	RGB 121 105 49	#796931

#604731 #644C31 #685231 #6C5831 #705D31 #746331 #796931

#604731 - #796931

HSVブレンド

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

0.0%	0.0% #604731	RGB 96 71 49	#604731
16.7%	16.7% #644B31	RGB 100 75 49	#644B31
33.3%	33.3% #685031	RGB 104 80 49	#685031
50.0%	50.0% #6C5631	RGB 108 86 49	#6C5631
66.7%	66.7% #705C31	RGB 112 92 49	#705C31
83.3%	83.3% #746231	RGB 116 98 49	#746231
100.0%	100.0% #796931	RGB 121 105 49	#796931

#604731 #644B31 #685031 #6C5631 #705C31 #746231 #796931

#604731 - #6C5631 - #796931

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #604731 0%, #6C5631 50%, #796931 100%);
    background: -webkit-linear-gradient(top, #604731 0%, #6C5631 50%, #796931 100%);
    background: linear-gradient(to bottom, #604731 0%, #6C5631 50%, #796931 100%); 
}
</style>