#158F85 - #BCDFDC | colorate

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

Blend #158F85 to #BCDFDC

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

RGBブレンド

#158F85 - #BCDFDC | colorate

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

0.0%	0.0% #158F85	RGB 21 143 133	#158F85
16.7%	16.7% #309C93	RGB 48 156 147	#309C93
33.3%	33.3% #4CA9A2	RGB 76 169 162	#4CA9A2
50.0%	50.0% #68B7B0	RGB 104 183 176	#68B7B0
66.7%	66.7% #84C4BF	RGB 132 196 191	#84C4BF
83.3%	83.3% #A0D1CD	RGB 160 209 205	#A0D1CD
100.0%	100.0% #BCDFDC	RGB 188 223 220	#BCDFDC

#158F85 #309C93 #4CA9A2 #68B7B0 #84C4BF #A0D1CD #BCDFDC

#158F85 - #BCDFDC

HSVブレンド

#158F85 - #BCDFDC | colorate

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

0.0%	0.0% #158F85	RGB 21 143 133	#158F85
16.7%	16.7% #299C92	RGB 41 156 146	#299C92
33.3%	33.3% #40A9A0	RGB 64 169 160	#40A9A0
50.0%	50.0% #5AB7AF	RGB 90 183 175	#5AB7AF
66.7%	66.7% #77C4BD	RGB 119 196 189	#77C4BD
83.3%	83.3% #98D1CC	RGB 152 209 204	#98D1CC
100.0%	100.0% #BCDFDC	RGB 188 223 220	#BCDFDC

#158F85 #299C92 #40A9A0 #5AB7AF #77C4BD #98D1CC #BCDFDC

#158F85 - #5AB7AF - #BCDFDC

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #158F85 0%, #5AB7AF 50%, #BCDFDC 100%);
    background: -webkit-linear-gradient(top, #158F85 0%, #5AB7AF 50%, #BCDFDC 100%);
    background: linear-gradient(to bottom, #158F85 0%, #5AB7AF 50%, #BCDFDC 100%);
}
</style>