#163B22 - #3D9062 | colorate

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

Blend #163B22 to #3D9062

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

RGBブレンド

#163B22 - #3D9062 | colorate

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

0.0%	0.0% #163B22	RGB 22 59 34	#163B22
16.7%	16.7% #1C492C	RGB 28 73 44	#1C492C
33.3%	33.3% #235737	RGB 35 87 55	#235737
50.0%	50.0% #296542	RGB 41 101 66	#296542
66.7%	66.7% #30734C	RGB 48 115 76	#30734C
83.3%	83.3% #368157	RGB 54 129 87	#368157
100.0%	100.0% #3D9062	RGB 61 144 98	#3D9062

#163B22 #1C492C #235737 #296542 #30734C #368157 #3D9062

#163B22 - #3D9062

HSVブレンド

#163B22 - #3D9062 | colorate

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

0.0%	0.0% #163B22	RGB 22 59 34	#163B22
16.7%	16.7% #1B492B	RGB 27 73 43	#1B492B
33.3%	33.3% #225735	RGB 34 87 53	#225735
50.0%	50.0% #28653F	RGB 40 101 63	#28653F
66.7%	66.7% #2F734A	RGB 47 115 74	#2F734A
83.3%	83.3% #358156	RGB 53 129 86	#358156
100.0%	100.0% #3D9062	RGB 61 144 98	#3D9062

#163B22 #1B492B #225735 #28653F #2F734A #358156 #3D9062

#163B22 - #28653F - #3D9062

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #163B22 0%, #28653F 50%, #3D9062 100%);
    background: -webkit-linear-gradient(top, #163B22 0%, #28653F 50%, #3D9062 100%);
    background: linear-gradient(to bottom, #163B22 0%, #28653F 50%, #3D9062 100%);
}
</style>