#858F1F - #F57A51 | colorate

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

Blend #858F1F to #F57A51

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

RGBブレンド

#858F1F - #F57A51 | colorate

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

0.0%	0.0% #858F1F	RGB 133 143 31	#858F1F
16.7%	16.7% #978B27	RGB 151 139 39	#978B27
33.3%	33.3% #AA882F	RGB 170 136 47	#AA882F
50.0%	50.0% #BD8438	RGB 189 132 56	#BD8438
66.7%	66.7% #CF8140	RGB 207 129 64	#CF8140
83.3%	83.3% #E27D48	RGB 226 125 72	#E27D48
100.0%	100.0% #F57A51	RGB 245 122 81	#F57A51

#858F1F #978B27 #AA882F #BD8438 #CF8140 #E27D48 #F57A51

#858F1F - #F57A51

HSVブレンド

#858F1F - #F57A51 | colorate

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

0.0%	0.0% #858F1F	RGB 133 143 31	#858F1F
16.7%	16.7% #A09925	RGB 160 153 37	#A09925
33.3%	33.3% #B1972D	RGB 177 151 45	#B1972D
50.0%	50.0% #C29335	RGB 194 147 53	#C29335
66.7%	66.7% #D38C3D	RGB 211 140 61	#D38C3D
83.3%	83.3% #E48447	RGB 228 132 71	#E48447
100.0%	100.0% #F57A51	RGB 245 122 81	#F57A51

#858F1F #A09925 #B1972D #C29335 #D38C3D #E48447 #F57A51

#858F1F - #C29335 - #F57A51

CSSコード

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

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