#7F1D8F - #7E94E4 | colorate

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

Blend #7F1D8F to #7E94E4

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

RGBブレンド

#7F1D8F - #7E94E4 | colorate

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

0.0%	0.0% #7F1D8F	RGB 127 29 143	#7F1D8F
16.7%	16.7% #7E309D	RGB 126 48 157	#7E309D
33.3%	33.3% #7E44AB	RGB 126 68 171	#7E44AB
50.0%	50.0% #7E58B9	RGB 126 88 185	#7E58B9
66.7%	66.7% #7E6CC7	RGB 126 108 199	#7E6CC7
83.3%	83.3% #7E80D5	RGB 126 128 213	#7E80D5
100.0%	100.0% #7E94E4	RGB 126 148 228	#7E94E4

#7F1D8F #7E309D #7E44AB #7E58B9 #7E6CC7 #7E80D5 #7E94E4

#7F1D8F - #7E94E4

HSVブレンド

#7F1D8F - #7E94E4 | colorate

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

0.0%	0.0% #7F1D8F	RGB 127 29 143	#7F1D8F
16.7%	16.7% #78299D	RGB 120 41 157	#78299D
33.3%	33.3% #7136AB	RGB 113 54 171	#7136AB
50.0%	50.0% #6B46B9	RGB 107 70 185	#6B46B9
66.7%	66.7% #6757C7	RGB 103 87 199	#6757C7
83.3%	83.3% #696DD5	RGB 105 109 213	#696DD5
100.0%	100.0% #7E94E4	RGB 126 148 228	#7E94E4

#7F1D8F #78299D #7136AB #6B46B9 #6757C7 #696DD5 #7E94E4

#7F1D8F - #6B46B9 - #7E94E4

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7F1D8F 0%, #6B46B9 50%, #7E94E4 100%);
    background: -webkit-linear-gradient(top, #7F1D8F 0%, #6B46B9 50%, #7E94E4 100%);
    background: linear-gradient(to bottom, #7F1D8F 0%, #6B46B9 50%, #7E94E4 100%);
}
</style>