#414340 - #283D03 | colorate

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

Blend #414340 to #283D03

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

RGBブレンド

#414340 - #283D03 | colorate

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

0.0%	0.0% #414340	RGB 65 67 64	#414340
16.7%	16.7% #3C4235	RGB 60 66 53	#3C4235
33.3%	33.3% #38412B	RGB 56 65 43	#38412B
50.0%	50.0% #344021	RGB 52 64 33	#344021
66.7%	66.7% #303F17	RGB 48 63 23	#303F17
83.3%	83.3% #2C3E0D	RGB 44 62 13	#2C3E0D
100.0%	100.0% #283D03	RGB 40 61 3	#283D03

#414340 #3C4235 #38412B #344021 #303F17 #2C3E0D #283D03

#414340 - #283D03

HSVブレンド

#414340 - #283D03 | colorate

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

0.0%	0.0% #414340	RGB 65 67 64	#414340
16.7%	16.7% #3A4235	RGB 58 66 53	#3A4235
33.3%	33.3% #34412A	RGB 52 65 42	#34412A
50.0%	50.0% #2F4020	RGB 47 64 32	#2F4020
66.7%	66.7% #2C3F16	RGB 44 63 22	#2C3F16
83.3%	83.3% #293E0C	RGB 41 62 12	#293E0C
100.0%	100.0% #283D03	RGB 40 61 3	#283D03

#414340 #3A4235 #34412A #2F4020 #2C3F16 #293E0C #283D03

#414340 - #2F4020 - #283D03

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #414340 0%, #2F4020 50%, #283D03 100%);
    background: -webkit-linear-gradient(top, #414340 0%, #2F4020 50%, #283D03 100%);
    background: linear-gradient(to bottom, #414340 0%, #2F4020 50%, #283D03 100%);
}
</style>