#4C2020 - #584520 | colorate

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

Blend #4C2020 to #584520

#4C2020

#584520

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

RGBブレンド

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

0.0%	0.0% #4C2020	RGB 76 32 32	#4C2020
16.7%	16.7% #4E2620	RGB 78 38 32	#4E2620
33.3%	33.3% #502C20	RGB 80 44 32	#502C20
50.0%	50.0% #523220	RGB 82 50 32	#523220
66.7%	66.7% #543820	RGB 84 56 32	#543820
83.3%	83.3% #563E20	RGB 86 62 32	#563E20
100.0%	100.0% #584520	RGB 88 69 32	#584520

#4C2020 #4E2620 #502C20 #523220 #543820 #563E20 #584520

#4C2020 - #584520

HSVブレンド

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

0.0%	0.0% #4C2020	RGB 76 32 32	#4C2020
16.7%	16.7% #4E2520	RGB 78 37 32	#4E2520
33.3%	33.3% #502A20	RGB 80 42 32	#502A20
50.0%	50.0% #523020	RGB 82 48 32	#523020
66.7%	66.7% #543620	RGB 84 54 32	#543620
83.3%	83.3% #563D20	RGB 86 61 32	#563D20
100.0%	100.0% #584520	RGB 88 69 32	#584520

#4C2020 #4E2520 #502A20 #523020 #543620 #563D20 #584520

#4C2020 - #523020 - #584520

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #4C2020 0%, #523020 50%, #584520 100%);
    background: -webkit-linear-gradient(top, #4C2020 0%, #523020 50%, #584520 100%);
    background: linear-gradient(to bottom, #4C2020 0%, #523020 50%, #584520 100%); 
}
</style>