#FF642C - #FDBA3D | colorate

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

Blend #FF642C to #FDBA3D

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

RGBブレンド

#FF642C - #FDBA3D | colorate

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

0.0%	0.0% #FF642C	RGB 255 100 44	#FF642C
16.7%	16.7% #FE722E	RGB 254 114 46	#FE722E
33.3%	33.3% #FE8031	RGB 254 128 49	#FE8031
50.0%	50.0% #FE8F34	RGB 254 143 52	#FE8F34
66.7%	66.7% #FD9D37	RGB 253 157 55	#FD9D37
83.3%	83.3% #FDAB3A	RGB 253 171 58	#FDAB3A
100.0%	100.0% #FDBA3D	RGB 253 186 61	#FDBA3D

#FF642C #FE722E #FE8031 #FE8F34 #FD9D37 #FDAB3A #FDBA3D

#FF642C - #FDBA3D

HSVブレンド

#FF642C - #FDBA3D | colorate

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

0.0%	0.0% #FF642B	RGB 255 100 43	#FF642B
16.7%	16.7% #FE732E	RGB 254 115 46	#FE732E
33.3%	33.3% #FE8231	RGB 254 130 49	#FE8231
50.0%	50.0% #FE9034	RGB 254 144 52	#FE9034
66.7%	66.7% #FD9E37	RGB 253 158 55	#FD9E37
83.3%	83.3% #FDAC3A	RGB 253 172 58	#FDAC3A
100.0%	100.0% #FDBA3D	RGB 253 186 61	#FDBA3D

#FF642B #FE732E #FE8231 #FE9034 #FD9E37 #FDAC3A #FDBA3D

#FF642C - #FE9034 - #FDBA3D

CSSコード

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

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