#4B3754 - #3D5437 | colorate

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

Blend #4B3754 to #3D5437

#4B3754 #3D5437

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

RGBブレンド

#4B3754 - #3D5437 | colorate

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

0.0%	0.0% #4B3754	RGB 75 55 84	#4B3754
16.7%	16.7% #483B4F	RGB 72 59 79	#483B4F
33.3%	33.3% #46404A	RGB 70 64 74	#46404A
50.0%	50.0% #444545	RGB 68 69 69	#444545
66.7%	66.7% #414A40	RGB 65 74 64	#414A40
83.3%	83.3% #3F4F3B	RGB 63 79 59	#3F4F3B
100.0%	100.0% #3D5437	RGB 61 84 55	#3D5437

#4B3754 #483B4F #46404A #444545 #414A40 #3F4F3B #3D5437

#4B3754 - #3D5437

HSVブレンド

#4B3754 - #3D5437 | colorate

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

0.0%	0.0% #4B3754	RGB 75 55 84	#4B3754
16.7%	16.7% #3D3754	RGB 61 55 84	#3D3754
33.3%	33.3% #373F54	RGB 55 63 84	#373F54
50.0%	50.0% #374D54	RGB 55 77 84	#374D54
66.7%	66.7% #37544C	RGB 55 84 76	#37544C
83.3%	83.3% #37543F	RGB 55 84 63	#37543F
100.0%	100.0% #3D5437	RGB 61 84 55	#3D5437

#4B3754 #3D3754 #373F54 #374D54 #37544C #37543F #3D5437

#4B3754 - #374D54 - #3D5437

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #4B3754 0%, #374D54 50%, #3D5437 100%);
    background: -webkit-linear-gradient(top, #4B3754 0%, #374D54 50%, #3D5437 100%);
    background: linear-gradient(to bottom, #4B3754 0%, #374D54 50%, #3D5437 100%);
}
</style>