#DDFFDC - #8CE797 | colorate

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

Blend #DDFFDC to #8CE797

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

RGBブレンド

#DDFFDC - #8CE797 | colorate

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

0.0%	0.0% #DDFFDC	RGB 221 255 220	#DDFFDC
16.7%	16.7% #CFFBD0	RGB 207 251 208	#CFFBD0
33.3%	33.3% #C2F7C5	RGB 194 247 197	#C2F7C5
50.0%	50.0% #B4F3B9	RGB 180 243 185	#B4F3B9
66.7%	66.7% #A7EFAE	RGB 167 239 174	#A7EFAE
83.3%	83.3% #99EBA2	RGB 153 235 162	#99EBA2
100.0%	100.0% #8CE797	RGB 140 231 151	#8CE797

#DDFFDC #CFFBD0 #C2F7C5 #B4F3B9 #A7EFAE #99EBA2 #8CE797

#DDFFDC - #8CE797

HSVブレンド

#DDFFDC - #8CE797 | colorate

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

0.0%	0.0% #DDFFDC	RGB 221 255 220	#DDFFDC
16.7%	16.7% #CDFBCD	RGB 205 251 205	#CDFBCD
33.3%	33.3% #BFF7C1	RGB 191 247 193	#BFF7C1
50.0%	50.0% #B2F3B5	RGB 178 243 181	#B2F3B5
66.7%	66.7% #A5EFAA	RGB 165 239 170	#A5EFAA
83.3%	83.3% #98EBA0	RGB 152 235 160	#98EBA0
100.0%	100.0% #8CE797	RGB 140 231 151	#8CE797

#DDFFDC #CDFBCD #BFF7C1 #B2F3B5 #A5EFAA #98EBA0 #8CE797

#DDFFDC - #B2F3B5 - #8CE797

CSSコード

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

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