#2E744C - #06100A | colorate

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

Tweet

Blend #2E744C to #06100A

#2E744C

#06100A

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

RGBブレンド

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

0.0%	0.0% #2E744C	RGB 46 116 76	#2E744C
16.7%	16.7% #286441	RGB 40 100 65	#286441
33.3%	33.3% #215336	RGB 33 83 54	#215336
50.0%	50.0% #1A422B	RGB 26 66 43	#1A422B
66.7%	66.7% #143220	RGB 20 50 32	#143220
83.3%	83.3% #0D2115	RGB 13 33 21	#0D2115
100.0%	100.0% #06100A	RGB 6 16 10	#06100A

#2E744C #286441 #215336 #1A422B #143220 #0D2115 #06100A

#2E744C - #06100A

HSVブレンド

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

0.0%	0.0% #2E744C	RGB 46 116 76	#2E744C
16.7%	16.7% #276340	RGB 39 99 64	#276340
33.3%	33.3% #205235	RGB 32 82 53	#205235
50.0%	50.0% #19422A	RGB 25 66 42	#19422A
66.7%	66.7% #12311F	RGB 18 49 31	#12311F
83.3%	83.3% #0C2014	RGB 12 32 20	#0C2014
100.0%	100.0% #06100A	RGB 6 16 10	#06100A

#2E744C #276340 #205235 #19422A #12311F #0C2014 #06100A

#2E744C - #19422A - #06100A

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #2E744C 0%, #19422A 50%, #06100A 100%);
    background: -webkit-linear-gradient(top, #2E744C 0%, #19422A 50%, #06100A 100%);
    background: linear-gradient(to bottom, #2E744C 0%, #19422A 50%, #06100A 100%); 
}
</style>