#76A573 - #72B194 | colorate

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

Blend #76A573 to #72B194

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

RGBブレンド

#76A573 - #72B194 | colorate

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

0.0%	0.0% #76A573	RGB 118 165 115	#76A573
16.7%	16.7% #75A778	RGB 117 167 120	#75A778
33.3%	33.3% #74A97E	RGB 116 169 126	#74A97E
50.0%	50.0% #74AB83	RGB 116 171 131	#74AB83
66.7%	66.7% #73AD89	RGB 115 173 137	#73AD89
83.3%	83.3% #72AF8E	RGB 114 175 142	#72AF8E
100.0%	100.0% #72B194	RGB 114 177 148	#72B194

#76A573 #75A778 #74A97E #74AB83 #73AD89 #72AF8E #72B194

#76A573 - #72B194

HSVブレンド

#76A573 - #72B194 | colorate

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

0.0%	0.0% #76A573	RGB 118 165 115	#76A573
16.7%	16.7% #72A775	RGB 114 167 117	#72A775
33.3%	33.3% #72A97A	RGB 114 169 122	#72A97A
50.0%	50.0% #72AB80	RGB 114 171 128	#72AB80
66.7%	66.7% #72AD86	RGB 114 173 134	#72AD86
83.3%	83.3% #72AF8C	RGB 114 175 140	#72AF8C
100.0%	100.0% #72B194	RGB 114 177 148	#72B194

#76A573 #72A775 #72A97A #72AB80 #72AD86 #72AF8C #72B194

#76A573 - #72AB80 - #72B194

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #76A573 0%, #72AB80 50%, #72B194 100%);
    background: -webkit-linear-gradient(top, #76A573 0%, #72AB80 50%, #72B194 100%);
    background: linear-gradient(to bottom, #76A573 0%, #72AB80 50%, #72B194 100%);
}
</style>