#506B8F - #75EEE9 | colorate

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

Blend #506B8F to #75EEE9

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

RGBブレンド

#506B8F - #75EEE9 | colorate

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

0.0%	0.0% #506B8F	RGB 80 107 143	#506B8F
16.7%	16.7% #56809E	RGB 86 128 158	#56809E
33.3%	33.3% #5C96AD	RGB 92 150 173	#5C96AD
50.0%	50.0% #62ACBC	RGB 98 172 188	#62ACBC
66.7%	66.7% #68C2CB	RGB 104 194 203	#68C2CB
83.3%	83.3% #6ED8DA	RGB 110 216 218	#6ED8DA
100.0%	100.0% #75EEE9	RGB 117 238 233	#75EEE9

#506B8F #56809E #5C96AD #62ACBC #68C2CB #6ED8DA #75EEE9

#506B8F - #75EEE9

HSVブレンド

#506B8F - #75EEE9 | colorate

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

0.0%	0.0% #506B8F	RGB 80 107 143	#506B8F
16.7%	16.7% #577D9E	RGB 87 125 158	#577D9E
33.3%	33.3% #5D90AE	RGB 93 144 174	#5D90AE
50.0%	50.0% #64A6BE	RGB 100 166 190	#64A6BE
66.7%	66.7% #6ABECE	RGB 106 190 206	#6ABECE
83.3%	83.3% #6FD7DE	RGB 111 215 222	#6FD7DE
100.0%	100.0% #75EEE9	RGB 117 238 233	#75EEE9

#506B8F #577D9E #5D90AE #64A6BE #6ABECE #6FD7DE #75EEE9

#506B8F - #64A6BE - #75EEE9

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #506B8F 0%, #64A6BE 50%, #75EEE9 100%);
    background: -webkit-linear-gradient(top, #506B8F 0%, #64A6BE 50%, #75EEE9 100%);
    background: linear-gradient(to bottom, #506B8F 0%, #64A6BE 50%, #75EEE9 100%);
}
</style>