#4DAD9C - #CCE7E2 | colorate

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

Blend #4DAD9C to #CCE7E2

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

RGBブレンド

#4DAD9C - #CCE7E2 | colorate

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

0.0%	0.0% #4DAD9C	RGB 77 173 156	#4DAD9C
16.7%	16.7% #62B6A7	RGB 98 182 167	#62B6A7
33.3%	33.3% #77C0B3	RGB 119 192 179	#77C0B3
50.0%	50.0% #8CCABF	RGB 140 202 191	#8CCABF
66.7%	66.7% #A1D3CA	RGB 161 211 202	#A1D3CA
83.3%	83.3% #B6DDD6	RGB 182 221 214	#B6DDD6
100.0%	100.0% #CCE7E2	RGB 204 231 226	#CCE7E2

#4DAD9C #62B6A7 #77C0B3 #8CCABF #A1D3CA #B6DDD6 #CCE7E2

#4DAD9C - #CCE7E2

HSVブレンド

#4DAD9C - #CCE7E2 | colorate

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

0.0%	0.0% #4DAD9C	RGB 77 173 156	#4DAD9C
16.7%	16.7% #5EB6A6	RGB 94 182 166	#5EB6A6
33.3%	33.3% #71C0B2	RGB 113 192 178	#71C0B2
50.0%	50.0% #86CABD	RGB 134 202 189	#86CABD
66.7%	66.7% #9CD3C9	RGB 156 211 201	#9CD3C9
83.3%	83.3% #B3DDD5	RGB 179 221 213	#B3DDD5
100.0%	100.0% #CCE7E2	RGB 204 231 226	#CCE7E2

#4DAD9C #5EB6A6 #71C0B2 #86CABD #9CD3C9 #B3DDD5 #CCE7E2

#4DAD9C - #86CABD - #CCE7E2

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4DAD9C 0%, #86CABD 50%, #CCE7E2 100%);
    background: -webkit-linear-gradient(top, #4DAD9C 0%, #86CABD 50%, #CCE7E2 100%);
    background: linear-gradient(to bottom, #4DAD9C 0%, #86CABD 50%, #CCE7E2 100%);
}
</style>