#89638F - #7F98E3 | colorate

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

Blend #89638F to #7F98E3

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

RGBブレンド

#89638F - #7F98E3 | colorate

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

0.0%	0.0% #89638F	RGB 137 99 143	#89638F
16.7%	16.7% #876B9D	RGB 135 107 157	#876B9D
33.3%	33.3% #8574AB	RGB 133 116 171	#8574AB
50.0%	50.0% #847DB9	RGB 132 125 185	#847DB9
66.7%	66.7% #8286C7	RGB 130 134 199	#8286C7
83.3%	83.3% #808FD5	RGB 128 143 213	#808FD5
100.0%	100.0% #7F98E3	RGB 127 152 227	#7F98E3

#89638F #876B9D #8574AB #847DB9 #8286C7 #808FD5 #7F98E3

#89638F - #7F98E3

HSVブレンド

#89638F - #7F98E3 | colorate

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

0.0%	0.0% #89638F	RGB 137 99 143	#89638F
16.7%	16.7% #8C699D	RGB 140 105 157	#8C699D
33.3%	33.3% #8C6EAB	RGB 140 110 171	#8C6EAB
50.0%	50.0% #8973B9	RGB 137 115 185	#8973B9
66.7%	66.7% #8178C7	RGB 129 120 199	#8178C7
83.3%	83.3% #7B81D5	RGB 123 129 213	#7B81D5
100.0%	100.0% #7F98E3	RGB 127 152 227	#7F98E3

#89638F #8C699D #8C6EAB #8973B9 #8178C7 #7B81D5 #7F98E3

#89638F - #8973B9 - #7F98E3

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #89638F 0%, #8973B9 50%, #7F98E3 100%);
    background: -webkit-linear-gradient(top, #89638F 0%, #8973B9 50%, #7F98E3 100%);
    background: linear-gradient(to bottom, #89638F 0%, #8973B9 50%, #7F98E3 100%);
}
</style>