#20292F - #00242F | colorate

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

Blend #20292F to #00242F

#20292F #00242F

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

RGBブレンド

#20292F - #00242F | colorate

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

0.0%	0.0% #20292F	RGB 32 41 47	#20292F
16.7%	16.7% #1A282F	RGB 26 40 47	#1A282F
33.3%	33.3% #15272F	RGB 21 39 47	#15272F
50.0%	50.0% #10262F	RGB 16 38 47	#10262F
66.7%	66.7% #0A252F	RGB 10 37 47	#0A252F
83.3%	83.3% #05242F	RGB 5 36 47	#05242F
100.0%	100.0% #00242F	RGB 0 36 47	#00242F

#20292F #1A282F #15272F #10262F #0A252F #05242F #00242F

#20292F - #00242F

HSVブレンド

#20292F - #00242F | colorate

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

0.0%	0.0% #20292F	RGB 32 41 47	#20292F
16.7%	16.7% #1A272F	RGB 26 39 47	#1A272F
33.3%	33.3% #15262F	RGB 21 38 47	#15262F
50.0%	50.0% #10252F	RGB 16 37 47	#10252F
66.7%	66.7% #0A242F	RGB 10 36 47	#0A242F
83.3%	83.3% #05242F	RGB 5 36 47	#05242F
100.0%	100.0% #00242F	RGB 0 36 47	#00242F

#20292F #1A272F #15262F #10252F #0A242F #05242F #00242F

#20292F - #10252F - #00242F

CSSコード

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

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