#DCECE2 - #82BAB4 | colorate

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

Blend #DCECE2 to #82BAB4

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

RGBブレンド

#DCECE2 - #82BAB4 | colorate

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

0.0%	0.0% #DCECE2	RGB 220 236 226	#DCECE2
16.7%	16.7% #CDE3DA	RGB 205 227 218	#CDE3DA
33.3%	33.3% #BEDBD2	RGB 190 219 210	#BEDBD2
50.0%	50.0% #AFD3CB	RGB 175 211 203	#AFD3CB
66.7%	66.7% #A0CAC3	RGB 160 202 195	#A0CAC3
83.3%	83.3% #91C2BB	RGB 145 194 187	#91C2BB
100.0%	100.0% #82BAB4	RGB 130 186 180	#82BAB4

#DCECE2 #CDE3DA #BEDBD2 #AFD3CB #A0CAC3 #91C2BB #82BAB4

#DCECE2 - #82BAB4

HSVブレンド

#DCECE2 - #82BAB4 | colorate

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

0.0%	0.0% #DCECE2	RGB 220 236 226	#DCECE2
16.7%	16.7% #CBE3D6	RGB 203 227 214	#CBE3D6
33.3%	33.3% #BBDBCC	RGB 187 219 204	#BBDBCC
50.0%	50.0% #ACD3C4	RGB 172 211 196	#ACD3C4
66.7%	66.7% #9DCABE	RGB 157 202 190	#9DCABE
83.3%	83.3% #8FC2B8	RGB 143 194 184	#8FC2B8
100.0%	100.0% #82BAB4	RGB 130 186 180	#82BAB4

#DCECE2 #CBE3D6 #BBDBCC #ACD3C4 #9DCABE #8FC2B8 #82BAB4

#DCECE2 - #ACD3C4 - #82BAB4

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #DCECE2 0%, #ACD3C4 50%, #82BAB4 100%);
    background: -webkit-linear-gradient(top, #DCECE2 0%, #ACD3C4 50%, #82BAB4 100%);
    background: linear-gradient(to bottom, #DCECE2 0%, #ACD3C4 50%, #82BAB4 100%);
}
</style>