#158F86 - #BCDFDC | colorate

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

Blend #158F86 to #BCDFDC

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

RGBブレンド

#158F86 - #BCDFDC | colorate

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

0.0%	0.0% #158F86	RGB 21 143 134	#158F86
16.7%	16.7% #309C94	RGB 48 156 148	#309C94
33.3%	33.3% #4CA9A2	RGB 76 169 162	#4CA9A2
50.0%	50.0% #68B7B1	RGB 104 183 177	#68B7B1
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

#158F86 #309C94 #4CA9A2 #68B7B1 #84C4BF #A0D1CD #BCDFDC

#158F86 - #BCDFDC

HSVブレンド

#158F86 - #BCDFDC | colorate

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

0.0%	0.0% #158F86	RGB 21 143 134	#158F86
16.7%	16.7% #299C93	RGB 41 156 147	#299C93
33.3%	33.3% #40A9A1	RGB 64 169 161	#40A9A1
50.0%	50.0% #5AB7AF	RGB 90 183 175	#5AB7AF
66.7%	66.7% #77C4BE	RGB 119 196 190	#77C4BE
83.3%	83.3% #98D1CC	RGB 152 209 204	#98D1CC
100.0%	100.0% #BCDFDC	RGB 188 223 220	#BCDFDC

#158F86 #299C93 #40A9A1 #5AB7AF #77C4BE #98D1CC #BCDFDC

#158F86 - #5AB7AF - #BCDFDC

CSSコード

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

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