#604731 - #796A31 | colorate

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

Blend #604731 to #796A31

#604731

#796A31

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

RGBブレンド

RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#604731を0%、#796A31を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% #705E31	RGB 112 94 49	#705E31
83.3%	83.3% #746431	RGB 116 100 49	#746431
100.0%	100.0% #796A31	RGB 121 106 49	#796A31

#604731 #644C31 #685231 #6C5831 #705E31 #746431 #796A31

#604731 - #796A31

HSVブレンド

HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#604731を0%、#796A31を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% #685131	RGB 104 81 49	#685131
50.0%	50.0% #6C5631	RGB 108 86 49	#6C5631
66.7%	66.7% #705C31	RGB 112 92 49	#705C31
83.3%	83.3% #746331	RGB 116 99 49	#746331
100.0%	100.0% #796A31	RGB 121 106 49	#796A31

#604731 #644B31 #685131 #6C5631 #705C31 #746331 #796A31

#604731 - #6C5631 - #796A31

CSSコード

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

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