#4A478F - #8B8F47 | colorate

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

Blend #4A478F to #8B8F47

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

RGBブレンド

#4A478F - #8B8F47 | colorate

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

0.0%	0.0% #4A478F	RGB 74 71 143	#4A478F
16.7%	16.7% #545383	RGB 84 83 131	#545383
33.3%	33.3% #5F5F77	RGB 95 95 119	#5F5F77
50.0%	50.0% #6A6B6B	RGB 106 107 107	#6A6B6B
66.7%	66.7% #75775F	RGB 117 119 95	#75775F
83.3%	83.3% #808353	RGB 128 131 83	#808353
100.0%	100.0% #8B8F47	RGB 139 143 71	#8B8F47

#4A478F #545383 #5F5F77 #6A6B6B #75775F #808353 #8B8F47

#4A478F - #8B8F47

HSVブレンド

#4A478F - #8B8F47 | colorate

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

0.0%	0.0% #49478F	RGB 73 71 143	#49478F
16.7%	16.7% #47678F	RGB 71 103 143	#47678F
33.3%	33.3% #478B8F	RGB 71 139 143	#478B8F
50.0%	50.0% #478F6E	RGB 71 143 110	#478F6E
66.7%	66.7% #478F4A	RGB 71 143 74	#478F4A
83.3%	83.3% #678F47	RGB 103 143 71	#678F47
100.0%	100.0% #8B8F47	RGB 139 143 71	#8B8F47

#49478F #47678F #478B8F #478F6E #478F4A #678F47 #8B8F47

#4A478F - #478F6E - #8B8F47

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #49478F 0%, #478F6E 50%, #8B8F47 100%);
    background: -webkit-linear-gradient(top, #49478F 0%, #478F6E 50%, #8B8F47 100%);
    background: linear-gradient(to bottom, #49478F 0%, #478F6E 50%, #8B8F47 100%);
}
</style>