#283E22 - #27572A | colorate

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

Blend #283E22 to #27572A

#283E22

#27572A

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

RGBブレンド

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

0.0%	0.0% #283E22	RGB 40 62 34	#283E22
16.7%	16.7% #284223	RGB 40 66 35	#284223
33.3%	33.3% #284624	RGB 40 70 36	#284624
50.0%	50.0% #284A26	RGB 40 74 38	#284A26
66.7%	66.7% #284E27	RGB 40 78 39	#284E27
83.3%	83.3% #285228	RGB 40 82 40	#285228
100.0%	100.0% #27572A	RGB 39 87 42	#27572A

#283E22 #284223 #284624 #284A26 #284E27 #285228 #27572A

#283E22 - #27572A

HSVブレンド

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

0.0%	0.0% #283E22	RGB 40 62 34	#283E22
16.7%	16.7% #284223	RGB 40 66 35	#284223
33.3%	33.3% #284624	RGB 40 70 36	#284624
50.0%	50.0% #274A25	RGB 39 74 37	#274A25
66.7%	66.7% #274E25	RGB 39 78 37	#274E25
83.3%	83.3% #265227	RGB 38 82 39	#265227
100.0%	100.0% #27572A	RGB 39 87 42	#27572A

#283E22 #284223 #284624 #274A25 #274E25 #265227 #27572A

#283E22 - #274A25 - #27572A

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #283E22 0%, #274A25 50%, #27572A 100%);
    background: -webkit-linear-gradient(top, #283E22 0%, #274A25 50%, #27572A 100%);
    background: linear-gradient(to bottom, #283E22 0%, #274A25 50%, #27572A 100%); 
}
</style>