#515556 - #809ACF | colorate

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

Blend #515556 to #809ACF

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

RGBブレンド

#515556 - #809ACF | colorate

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

0.0%	0.0% #515556	RGB 81 85 86	#515556
16.7%	16.7% #58606A	RGB 88 96 106	#58606A
33.3%	33.3% #606C7E	RGB 96 108 126	#606C7E
50.0%	50.0% #687792	RGB 104 119 146	#687792
66.7%	66.7% #7083A6	RGB 112 131 166	#7083A6
83.3%	83.3% #788EBA	RGB 120 142 186	#788EBA
100.0%	100.0% #809ACF	RGB 128 154 207	#809ACF

#515556 #58606A #606C7E #687792 #7083A6 #788EBA #809ACF

#515556 - #809ACF

HSVブレンド

#515556 - #809ACF | colorate

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

0.0%	0.0% #515556	RGB 81 85 86	#515556
16.7%	16.7% #5E666A	RGB 94 102 106	#5E666A
33.3%	33.3% #69767E	RGB 105 118 126	#69767E
50.0%	50.0% #728492	RGB 114 132 146	#728492
66.7%	66.7% #798FA6	RGB 121 143 166	#798FA6
83.3%	83.3% #7D96BA	RGB 125 150 186	#7D96BA
100.0%	100.0% #809ACF	RGB 128 154 207	#809ACF

#515556 #5E666A #69767E #728492 #798FA6 #7D96BA #809ACF

#515556 - #728492 - #809ACF

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #515556 0%, #728492 50%, #809ACF 100%);
    background: -webkit-linear-gradient(top, #515556 0%, #728492 50%, #809ACF 100%);
    background: linear-gradient(to bottom, #515556 0%, #728492 50%, #809ACF 100%);
}
</style>