#004040 - #002616 | colorate

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

Blend #004040 to #002616

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

RGBブレンド

#004040 - #002616 | colorate

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

0.0%	0.0% #004040	RGB 0 64 64	#004040
16.7%	16.7% #003B39	RGB 0 59 57	#003B39
33.3%	33.3% #003732	RGB 0 55 50	#003732
50.0%	50.0% #00332B	RGB 0 51 43	#00332B
66.7%	66.7% #002E24	RGB 0 46 36	#002E24
83.3%	83.3% #002A1D	RGB 0 42 29	#002A1D
100.0%	100.0% #002616	RGB 0 38 22	#002616

#004040 #003B39 #003732 #00332B #002E24 #002A1D #002616

#004040 - #002616

HSVブレンド

#004040 - #002616 | colorate

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

0.0%	0.0% #004040	RGB 0 64 64	#004040
16.7%	16.7% #003B37	RGB 0 59 55	#003B37
33.3%	33.3% #00372F	RGB 0 55 47	#00372F
50.0%	50.0% #003328	RGB 0 51 40	#003328
66.7%	66.7% #002E21	RGB 0 46 33	#002E21
83.3%	83.3% #002A1B	RGB 0 42 27	#002A1B
100.0%	100.0% #002616	RGB 0 38 22	#002616

#004040 #003B37 #00372F #003328 #002E21 #002A1B #002616

#004040 - #003328 - #002616

CSSコード

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

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