#46373A - #374640 | colorate

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

Blend #46373A to #374640

#46373A

#374640

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

RGBブレンド

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

0.0%	0.0% #46373A	RGB 70 55 58	#46373A
16.7%	16.7% #44393B	RGB 68 57 59	#44393B
33.3%	33.3% #413C3C	RGB 65 60 60	#413C3C
50.0%	50.0% #3F3E3D	RGB 63 62 61	#3F3E3D
66.7%	66.7% #3C413E	RGB 60 65 62	#3C413E
83.3%	83.3% #3A433F	RGB 58 67 63	#3A433F
100.0%	100.0% #374640	RGB 55 70 64	#374640

#46373A #44393B #413C3C #3F3E3D #3C413E #3A433F #374640

#46373A - #374640

HSVブレンド

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

0.0%	0.0% #46373A	RGB 70 55 58	#46373A
16.7%	16.7% #463B37	RGB 70 59 55	#463B37
33.3%	33.3% #464237	RGB 70 66 55	#464237
50.0%	50.0% #424637	RGB 66 70 55	#424637
66.7%	66.7% #3C4637	RGB 60 70 55	#3C4637
83.3%	83.3% #374639	RGB 55 70 57	#374639
100.0%	100.0% #374640	RGB 55 70 64	#374640

#46373A #463B37 #464237 #424637 #3C4637 #374639 #374640

#46373A - #424637 - #374640

CSSコード

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

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