#56438E - #798E43 | colorate

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

Blend #56438E to #798E43

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

RGBブレンド

#56438E - #798E43 | colorate

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

0.0%	0.0% #56438E	RGB 86 67 142	#56438E
16.7%	16.7% #5B4F81	RGB 91 79 129	#5B4F81
33.3%	33.3% #615C75	RGB 97 92 117	#615C75
50.0%	50.0% #676868	RGB 103 104 104	#676868
66.7%	66.7% #6D755C	RGB 109 117 92	#6D755C
83.3%	83.3% #73814F	RGB 115 129 79	#73814F
100.0%	100.0% #798E43	RGB 121 142 67	#798E43

#56438E #5B4F81 #615C75 #676868 #6D755C #73814F #798E43

#56438E - #798E43

HSVブレンド

#56438E - #798E43 | colorate

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

0.0%	0.0% #56438E	RGB 86 67 142	#56438E
16.7%	16.7% #43558E	RGB 67 85 142	#43558E
33.3%	33.3% #437A8E	RGB 67 122 142	#437A8E
50.0%	50.0% #438E7C	RGB 67 142 124	#438E7C
66.7%	66.7% #438E57	RGB 67 142 87	#438E57
83.3%	83.3% #538E43	RGB 83 142 67	#538E43
100.0%	100.0% #798E43	RGB 121 142 67	#798E43

#56438E #43558E #437A8E #438E7C #438E57 #538E43 #798E43

#56438E - #438E7C - #798E43

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #56438E 0%, #438E7C 50%, #798E43 100%);
    background: -webkit-linear-gradient(top, #56438E 0%, #438E7C 50%, #798E43 100%);
    background: linear-gradient(to bottom, #56438E 0%, #438E7C 50%, #798E43 100%);
}
</style>