#007800 - #053706 | colorate

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

Blend #007800 to #053706

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

RGBブレンド

#007800 - #053706 | colorate

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

0.0%	0.0% #007800	RGB 0 120 0	#007800
16.7%	16.7% #006D01	RGB 0 109 1	#006D01
33.3%	33.3% #016202	RGB 1 98 2	#016202
50.0%	50.0% #025703	RGB 2 87 3	#025703
66.7%	66.7% #034C04	RGB 3 76 4	#034C04
83.3%	83.3% #044105	RGB 4 65 5	#044105
100.0%	100.0% #053706	RGB 5 55 6	#053706

#007800 #006D01 #016202 #025703 #034C04 #044105 #053706

#007800 - #053706

HSVブレンド

#007800 - #053706 | colorate

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

0.0%	0.0% #007800	RGB 0 120 0	#007800
16.7%	16.7% #016D02	RGB 1 109 2	#016D02
33.3%	33.3% #026203	RGB 2 98 3	#026203
50.0%	50.0% #035704	RGB 3 87 4	#035704
66.7%	66.7% #044C05	RGB 4 76 5	#044C05
83.3%	83.3% #044106	RGB 4 65 6	#044106
100.0%	100.0% #053706	RGB 5 55 6	#053706

#007800 #016D02 #026203 #035704 #044C05 #044106 #053706

#007800 - #035704 - #053706

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #007800 0%, #035704 50%, #053706 100%);
    background: -webkit-linear-gradient(top, #007800 0%, #035704 50%, #053706 100%);
    background: linear-gradient(to bottom, #007800 0%, #035704 50%, #053706 100%);
}
</style>