#2B5E5A - #8970BA | colorate

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

Blend #2B5E5A to #8970BA

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

RGBブレンド

#2B5E5A - #8970BA | colorate

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

0.0%	0.0% #2B5E5A	RGB 43 94 90	#2B5E5A
16.7%	16.7% #3A616A	RGB 58 97 106	#3A616A
33.3%	33.3% #4A647A	RGB 74 100 122	#4A647A
50.0%	50.0% #5A678A	RGB 90 103 138	#5A678A
66.7%	66.7% #696A9A	RGB 105 106 154	#696A9A
83.3%	83.3% #796DAA	RGB 121 109 170	#796DAA
100.0%	100.0% #8970BA	RGB 137 112 186	#8970BA

#2B5E5A #3A616A #4A647A #5A678A #696A9A #796DAA #8970BA

#2B5E5A - #8970BA

HSVブレンド

#2B5E5A - #8970BA | colorate

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

0.0%	0.0% #2B5E5A	RGB 43 94 90	#2B5E5A
16.7%	16.7% #34646D	RGB 52 100 109	#34646D
33.3%	33.3% #3F647C	RGB 63 100 124	#3F647C
50.0%	50.0% #4A628C	RGB 74 98 140	#4A628C
66.7%	66.7% #565F9B	RGB 86 95 155	#565F9B
83.3%	83.3% #6962AA	RGB 105 98 170	#6962AA
100.0%	100.0% #8970BA	RGB 137 112 186	#8970BA

#2B5E5A #34646D #3F647C #4A628C #565F9B #6962AA #8970BA

#2B5E5A - #4A628C - #8970BA

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2B5E5A 0%, #4A628C 50%, #8970BA 100%);
    background: -webkit-linear-gradient(top, #2B5E5A 0%, #4A628C 50%, #8970BA 100%);
    background: linear-gradient(to bottom, #2B5E5A 0%, #4A628C 50%, #8970BA 100%);
}
</style>