#1E568E - #558E1E | colorate

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

Blend #1E568E to #558E1E

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

RGBブレンド

#1E568E - #558E1E | colorate

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

0.0%	0.0% #1E568E	RGB 30 86 142	#1E568E
16.7%	16.7% #275F7B	RGB 39 95 123	#275F7B
33.3%	33.3% #306868	RGB 48 104 104	#306868
50.0%	50.0% #397256	RGB 57 114 86	#397256
66.7%	66.7% #427B43	RGB 66 123 67	#427B43
83.3%	83.3% #4B8430	RGB 75 132 48	#4B8430
100.0%	100.0% #558E1E	RGB 85 142 30	#558E1E

#1E568E #275F7B #306868 #397256 #427B43 #4B8430 #558E1E

#1E568E - #558E1E

HSVブレンド

#1E568E - #558E1E | colorate

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

0.0%	0.0% #1E568E	RGB 30 86 142	#1E568E
16.7%	16.7% #1E7B8E	RGB 30 123 142	#1E7B8E
33.3%	33.3% #1E8E7B	RGB 30 142 123	#1E8E7B
50.0%	50.0% #1E8E56	RGB 30 142 86	#1E8E56
66.7%	66.7% #1E8E31	RGB 30 142 49	#1E8E31
83.3%	83.3% #2F8E1E	RGB 47 142 30	#2F8E1E
100.0%	100.0% #558E1E	RGB 85 142 30	#558E1E

#1E568E #1E7B8E #1E8E7B #1E8E56 #1E8E31 #2F8E1E #558E1E

#1E568E - #1E8E56 - #558E1E

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1E568E 0%, #1E8E56 50%, #558E1E 100%);
    background: -webkit-linear-gradient(top, #1E568E 0%, #1E8E56 50%, #558E1E 100%);
    background: linear-gradient(to bottom, #1E568E 0%, #1E8E56 50%, #558E1E 100%);
}
</style>