#328F8B - #0B6153 | colorate

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

Blend #328F8B to #0B6153

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

RGBブレンド

#328F8B - #0B6153 | colorate

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

0.0%	0.0% #328F8B	RGB 50 143 139	#328F8B
16.7%	16.7% #2B8781	RGB 43 135 129	#2B8781
33.3%	33.3% #257F78	RGB 37 127 120	#257F78
50.0%	50.0% #1E786F	RGB 30 120 111	#1E786F
66.7%	66.7% #187065	RGB 24 112 101	#187065
83.3%	83.3% #11685C	RGB 17 104 92	#11685C
100.0%	100.0% #0B6153	RGB 11 97 83	#0B6153

#328F8B #2B8781 #257F78 #1E786F #187065 #11685C #0B6153

#328F8B - #0B6153

HSVブレンド

#328F8B - #0B6153 | colorate

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

0.0%	0.0% #328F8B	RGB 50 143 139	#328F8B
16.7%	16.7% #298781	RGB 41 135 129	#298781
33.3%	33.3% #227F77	RGB 34 127 119	#227F77
50.0%	50.0% #1B786E	RGB 27 120 110	#1B786E
66.7%	66.7% #157065	RGB 21 112 101	#157065
83.3%	83.3% #0F685C	RGB 15 104 92	#0F685C
100.0%	100.0% #0B6153	RGB 11 97 83	#0B6153

#328F8B #298781 #227F77 #1B786E #157065 #0F685C #0B6153

#328F8B - #1B786E - #0B6153

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #328F8B 0%, #1B786E 50%, #0B6153 100%);
    background: -webkit-linear-gradient(top, #328F8B 0%, #1B786E 50%, #0B6153 100%);
    background: linear-gradient(to bottom, #328F8B 0%, #1B786E 50%, #0B6153 100%);
}
</style>