#648F7D - #A2CE84 | colorate

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

Blend #648F7D to #A2CE84

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

RGBブレンド

#648F7D - #A2CE84 | colorate

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

0.0%	0.0% #648F7D	RGB 100 143 125	#648F7D
16.7%	16.7% #6E997E	RGB 110 153 126	#6E997E
33.3%	33.3% #78A47F	RGB 120 164 127	#78A47F
50.0%	50.0% #83AE80	RGB 131 174 128	#83AE80
66.7%	66.7% #8DB981	RGB 141 185 129	#8DB981
83.3%	83.3% #97C382	RGB 151 195 130	#97C382
100.0%	100.0% #A2CE84	RGB 162 206 132	#A2CE84

#648F7D #6E997E #78A47F #83AE80 #8DB981 #97C382 #A2CE84

#648F7D - #A2CE84

HSVブレンド

#648F7D - #A2CE84 | colorate

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

0.0%	0.0% #648F7D	RGB 100 143 125	#648F7D
16.7%	16.7% #69997D	RGB 105 153 125	#69997D
33.3%	33.3% #6FA47C	RGB 111 164 124	#6FA47C
50.0%	50.0% #74AE79	RGB 116 174 121	#74AE79
66.7%	66.7% #7EB97A	RGB 126 185 122	#7EB97A
83.3%	83.3% #8FC37F	RGB 143 195 127	#8FC37F
100.0%	100.0% #A2CE84	RGB 162 206 132	#A2CE84

#648F7D #69997D #6FA47C #74AE79 #7EB97A #8FC37F #A2CE84

#648F7D - #74AE79 - #A2CE84

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #648F7D 0%, #74AE79 50%, #A2CE84 100%);
    background: -webkit-linear-gradient(top, #648F7D 0%, #74AE79 50%, #A2CE84 100%);
    background: linear-gradient(to bottom, #648F7D 0%, #74AE79 50%, #A2CE84 100%);
}
</style>