#AFBE98 - #F5E7B0 | colorate

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

Blend #AFBE98 to #F5E7B0

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

RGBブレンド

#AFBE98 - #F5E7B0 | colorate

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

0.0%	0.0% #AFBE98	RGB 175 190 152	#AFBE98
16.7%	16.7% #BAC49C	RGB 186 196 156	#BAC49C
33.3%	33.3% #C6CBA0	RGB 198 203 160	#C6CBA0
50.0%	50.0% #D2D2A4	RGB 210 210 164	#D2D2A4
66.7%	66.7% #DDD9A8	RGB 221 217 168	#DDD9A8
83.3%	83.3% #E9E0AC	RGB 233 224 172	#E9E0AC
100.0%	100.0% #F5E7B0	RGB 245 231 176	#F5E7B0

#AFBE98 #BAC49C #C6CBA0 #D2D2A4 #DDD9A8 #E9E0AC #F5E7B0

#AFBE98 - #F5E7B0

HSVブレンド

#AFBE98 - #F5E7B0 | colorate

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

0.0%	0.0% #AFBE98	RGB 175 190 152	#AFBE98
16.7%	16.7% #BAC79C	RGB 186 199 156	#BAC79C
33.3%	33.3% #C7D0A0	RGB 199 208 160	#C7D0A0
50.0%	50.0% #D4D9A5	RGB 212 217 165	#D4D9A5
66.7%	66.7% #E2E2A8	RGB 226 226 168	#E2E2A8
83.3%	83.3% #EBE5AC	RGB 235 229 172	#EBE5AC
100.0%	100.0% #F5E7B0	RGB 245 231 176	#F5E7B0

#AFBE98 #BAC79C #C7D0A0 #D4D9A5 #E2E2A8 #EBE5AC #F5E7B0

#AFBE98 - #D4D9A5 - #F5E7B0

CSSコード

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

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