#142530 - #545186 | colorate

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

Blend #142530 to #545186

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

RGBブレンド

#142530 - #545186 | colorate

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

0.0%	0.0% #142530	RGB 20 37 48	#142530
16.7%	16.7% #1E2C3E	RGB 30 44 62	#1E2C3E
33.3%	33.3% #29334C	RGB 41 51 76	#29334C
50.0%	50.0% #343B5B	RGB 52 59 91	#343B5B
66.7%	66.7% #3E4269	RGB 62 66 105	#3E4269
83.3%	83.3% #494977	RGB 73 73 119	#494977
100.0%	100.0% #545186	RGB 84 81 134	#545186

#142530 #1E2C3E #29334C #343B5B #3E4269 #494977 #545186

#142530 - #545186

HSVブレンド

#142530 - #545186 | colorate

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

0.0%	0.0% #142530	RGB 20 37 48	#142530
16.7%	16.7% #1B2D3E	RGB 27 45 62	#1B2D3E
33.3%	33.3% #24344C	RGB 36 52 76	#24344C
50.0%	50.0% #2E3A5B	RGB 46 58 91	#2E3A5B
66.7%	66.7% #394169	RGB 57 65 105	#394169
83.3%	83.3% #444777	RGB 68 71 119	#444777
100.0%	100.0% #545186	RGB 84 81 134	#545186

#142530 #1B2D3E #24344C #2E3A5B #394169 #444777 #545186

#142530 - #2E3A5B - #545186

CSSコード

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

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