#2D4132 - #314D49 | colorate

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

Tweet

Blend #2D4132 to #314D49

#2D4132

#314D49

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

RGBブレンド

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

0.0%	0.0% #2D4132	RGB 45 65 50	#2D4132
16.7%	16.7% #2D4335	RGB 45 67 53	#2D4335
33.3%	33.3% #2E4539	RGB 46 69 57	#2E4539
50.0%	50.0% #2F473D	RGB 47 71 61	#2F473D
66.7%	66.7% #2F4941	RGB 47 73 65	#2F4941
83.3%	83.3% #304B45	RGB 48 75 69	#304B45
100.0%	100.0% #314D49	RGB 49 77 73	#314D49

#2D4132 #2D4335 #2E4539 #2F473D #2F4941 #304B45 #314D49

#2D4132 - #314D49

HSVブレンド

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

0.0%	0.0% #2D4132	RGB 45 65 50	#2D4132
16.7%	16.7% #2D4335	RGB 45 67 53	#2D4335
33.3%	33.3% #2E4538	RGB 46 69 56	#2E4538
50.0%	50.0% #2F473C	RGB 47 71 60	#2F473C
66.7%	66.7% #2F4940	RGB 47 73 64	#2F4940
83.3%	83.3% #304B44	RGB 48 75 68	#304B44
100.0%	100.0% #314D49	RGB 49 77 73	#314D49

#2D4132 #2D4335 #2E4538 #2F473C #2F4940 #304B44 #314D49

#2D4132 - #2F473C - #314D49

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #2D4132 0%, #2F473C 50%, #314D49 100%);
    background: -webkit-linear-gradient(top, #2D4132 0%, #2F473C 50%, #314D49 100%);
    background: linear-gradient(to bottom, #2D4132 0%, #2F473C 50%, #314D49 100%); 
}
</style>