#BBCFDF - #5E8CA5 | colorate

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

Blend #BBCFDF to #5E8CA5

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

RGBブレンド

#BBCFDF - #5E8CA5 | colorate

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

0.0%	0.0% #BBCFDF	RGB 187 207 223	#BBCFDF
16.7%	16.7% #ABC3D5	RGB 171 195 213	#ABC3D5
33.3%	33.3% #9CB8CB	RGB 156 184 203	#9CB8CB
50.0%	50.0% #8CADC2	RGB 140 173 194	#8CADC2
66.7%	66.7% #7DA2B8	RGB 125 162 184	#7DA2B8
83.3%	83.3% #6D97AE	RGB 109 151 174	#6D97AE
100.0%	100.0% #5E8CA5	RGB 94 140 165	#5E8CA5

#BBCFDF #ABC3D5 #9CB8CB #8CADC2 #7DA2B8 #6D97AE #5E8CA5

#BBCFDF - #5E8CA5

HSVブレンド

#BBCFDF - #5E8CA5 | colorate

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

0.0%	0.0% #BBCFDF	RGB 187 207 223	#BBCFDF
16.7%	16.7% #A9C2D5	RGB 169 194 213	#A9C2D5
33.3%	33.3% #98B6CB	RGB 152 182 203	#98B6CB
50.0%	50.0% #88ABC2	RGB 136 171 194	#88ABC2
66.7%	66.7% #79A0B8	RGB 121 160 184	#79A0B8
83.3%	83.3% #6B95AE	RGB 107 149 174	#6B95AE
100.0%	100.0% #5E8CA5	RGB 94 140 165	#5E8CA5

#BBCFDF #A9C2D5 #98B6CB #88ABC2 #79A0B8 #6B95AE #5E8CA5

#BBCFDF - #88ABC2 - #5E8CA5

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBCFDF 0%, #88ABC2 50%, #5E8CA5 100%);
    background: -webkit-linear-gradient(top, #BBCFDF 0%, #88ABC2 50%, #5E8CA5 100%);
    background: linear-gradient(to bottom, #BBCFDF 0%, #88ABC2 50%, #5E8CA5 100%);
}
</style>