#FF9F3A - #EDDD5E | colorate

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

Blend #FF9F3A to #EDDD5E

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

RGBブレンド

#FF9F3A - #EDDD5E | colorate

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

0.0%	0.0% #FF9F3A	RGB 255 159 58	#FF9F3A
16.7%	16.7% #FCA940	RGB 252 169 64	#FCA940
33.3%	33.3% #F9B346	RGB 249 179 70	#F9B346
50.0%	50.0% #F6BE4C	RGB 246 190 76	#F6BE4C
66.7%	66.7% #F3C852	RGB 243 200 82	#F3C852
83.3%	83.3% #F0D258	RGB 240 210 88	#F0D258
100.0%	100.0% #EDDD5E	RGB 237 221 94	#EDDD5E

#FF9F3A #FCA940 #F9B346 #F6BE4C #F3C852 #F0D258 #EDDD5E

#FF9F3A - #EDDD5E

HSVブレンド

#FF9F3A - #EDDD5E | colorate

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

0.0%	0.0% #FF9F39	RGB 255 159 57	#FF9F39
16.7%	16.7% #FCAC40	RGB 252 172 64	#FCAC40
33.3%	33.3% #F9B846	RGB 249 184 70	#F9B846
50.0%	50.0% #F6C34C	RGB 246 195 76	#F6C34C
66.7%	66.7% #F3CC52	RGB 243 204 82	#F3CC52
83.3%	83.3% #F0D558	RGB 240 213 88	#F0D558
100.0%	100.0% #EDDD5E	RGB 237 221 94	#EDDD5E

#FF9F39 #FCAC40 #F9B846 #F6C34C #F3CC52 #F0D558 #EDDD5E

#FF9F3A - #F6C34C - #EDDD5E

CSSコード

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

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