#AFAFB6 - #B9E5E2 | colorate

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

Blend #AFAFB6 to #B9E5E2

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

RGBブレンド

#AFAFB6 - #B9E5E2 | colorate

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

0.0%	0.0% #AFAFB6	RGB 175 175 182	#AFAFB6
16.7%	16.7% #B0B8BD	RGB 176 184 189	#B0B8BD
33.3%	33.3% #B2C1C4	RGB 178 193 196	#B2C1C4
50.0%	50.0% #B4CACC	RGB 180 202 204	#B4CACC
66.7%	66.7% #B5D3D3	RGB 181 211 211	#B5D3D3
83.3%	83.3% #B7DCDA	RGB 183 220 218	#B7DCDA
100.0%	100.0% #B9E5E2	RGB 185 229 226	#B9E5E2

#AFAFB6 #B0B8BD #B2C1C4 #B4CACC #B5D3D3 #B7DCDA #B9E5E2

#AFAFB6 - #B9E5E2

HSVブレンド

#AFAFB6 - #B9E5E2 | colorate

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

0.0%	0.0% #AFAFB6	RGB 175 175 182	#AFAFB6
16.7%	16.7% #B1B3BD	RGB 177 179 189	#B1B3BD
33.3%	33.3% #B3BAC5	RGB 179 186 197	#B3BAC5
50.0%	50.0% #B5C2CD	RGB 181 194 205	#B5C2CD
66.7%	66.7% #B7CCD5	RGB 183 204 213	#B7CCD5
83.3%	83.3% #B8D9DD	RGB 184 217 221	#B8D9DD
100.0%	100.0% #B9E5E2	RGB 185 229 226	#B9E5E2

#AFAFB6 #B1B3BD #B3BAC5 #B5C2CD #B7CCD5 #B8D9DD #B9E5E2

#AFAFB6 - #B5C2CD - #B9E5E2

CSSコード

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

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