#9AFF9A - #FFF4AA | colorate

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

Blend #9AFF9A to #FFF4AA

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

RGBブレンド

#9AFF9A - #FFF4AA | colorate

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

0.0%	0.0% #9AFF9A	RGB 154 255 154	#9AFF9A
16.7%	16.7% #AAFD9C	RGB 170 253 156	#AAFD9C
33.3%	33.3% #BBFB9F	RGB 187 251 159	#BBFB9F
50.0%	50.0% #CCF9A2	RGB 204 249 162	#CCF9A2
66.7%	66.7% #DDF7A4	RGB 221 247 164	#DDF7A4
83.3%	83.3% #EEF5A7	RGB 238 245 167	#EEF5A7
100.0%	100.0% #FFF4AA	RGB 255 244 170	#FFF4AA

#9AFF9A #AAFD9C #BBFB9F #CCF9A2 #DDF7A4 #EEF5A7 #FFF4AA

#9AFF9A - #FFF4AA

HSVブレンド

#9AFF9A - #FFF4AA | colorate

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

0.0%	0.0% #9AFF9A	RGB 154 255 154	#9AFF9A
16.7%	16.7% #AFFF9C	RGB 175 255 156	#AFFF9C
33.3%	33.3% #C3FF9F	RGB 195 255 159	#C3FF9F
50.0%	50.0% #D6FFA2	RGB 214 255 162	#D6FFA2
66.7%	66.7% #E8FFA4	RGB 232 255 164	#E8FFA4
83.3%	83.3% #F9FFA7	RGB 249 255 167	#F9FFA7
100.0%	100.0% #FFF4AA	RGB 255 244 170	#FFF4AA

#9AFF9A #AFFF9C #C3FF9F #D6FFA2 #E8FFA4 #F9FFA7 #FFF4AA

#9AFF9A - #D6FFA2 - #FFF4AA

CSSコード

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

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