#5E99AC - #D3D3C2 | colorate

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

Blend #5E99AC to #D3D3C2

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

RGBブレンド

#5E99AC - #D3D3C2 | colorate

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

0.0%	0.0% #5E99AC	RGB 94 153 172	#5E99AC
16.7%	16.7% #71A2AF	RGB 113 162 175	#71A2AF
33.3%	33.3% #85ACB3	RGB 133 172 179	#85ACB3
50.0%	50.0% #98B6B7	RGB 152 182 183	#98B6B7
66.7%	66.7% #ACBFBA	RGB 172 191 186	#ACBFBA
83.3%	83.3% #BFC9BE	RGB 191 201 190	#BFC9BE
100.0%	100.0% #D3D3C2	RGB 211 211 194	#D3D3C2

#5E99AC #71A2AF #85ACB3 #98B6B7 #ACBFBA #BFC9BE #D3D3C2

#5E99AC - #D3D3C2

HSVブレンド

#5E99AC - #D3D3C2 | colorate

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

0.0%	0.0% #5E99AC	RGB 94 153 172	#5E99AC
16.7%	16.7% #6CB2A9	RGB 108 178 169	#6CB2A9
33.3%	33.3% #7CB99A	RGB 124 185 154	#7CB99A
50.0%	50.0% #8CBF92	RGB 140 191 146	#8CBF92
66.7%	66.7% #A7C69D	RGB 167 198 157	#A7C69D
83.3%	83.3% #C1CCAF	RGB 193 204 175	#C1CCAF
100.0%	100.0% #D3D3C2	RGB 211 211 194	#D3D3C2

#5E99AC #6CB2A9 #7CB99A #8CBF92 #A7C69D #C1CCAF #D3D3C2

#5E99AC - #8CBF92 - #D3D3C2

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E99AC 0%, #8CBF92 50%, #D3D3C2 100%);
    background: -webkit-linear-gradient(top, #5E99AC 0%, #8CBF92 50%, #D3D3C2 100%);
    background: linear-gradient(to bottom, #5E99AC 0%, #8CBF92 50%, #D3D3C2 100%);
}
</style>