#86B5E4 - #263341 | colorate

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

Blend #86B5E4 to #263341

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

RGBブレンド

#86B5E4 - #263341 | colorate

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

0.0%	0.0% #86B5E4	RGB 134 181 228	#86B5E4
16.7%	16.7% #769FC8	RGB 118 159 200	#769FC8
33.3%	33.3% #6689AD	RGB 102 137 173	#6689AD
50.0%	50.0% #567492	RGB 86 116 146	#567492
66.7%	66.7% #465E77	RGB 70 94 119	#465E77
83.3%	83.3% #36485C	RGB 54 72 92	#36485C
100.0%	100.0% #263341	RGB 38 51 65	#263341

#86B5E4 #769FC8 #6689AD #567492 #465E77 #36485C #263341

#86B5E4 - #263341

HSVブレンド

#86B5E4 - #263341 | colorate

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

0.0%	0.0% #86B4E4	RGB 134 180 228	#86B4E4
16.7%	16.7% #759FC8	RGB 117 159 200	#759FC8
33.3%	33.3% #6589AD	RGB 101 137 173	#6589AD
50.0%	50.0% #557392	RGB 85 115 146	#557392
66.7%	66.7% #455E77	RGB 69 94 119	#455E77
83.3%	83.3% #35485C	RGB 53 72 92	#35485C
100.0%	100.0% #263341	RGB 38 51 65	#263341

#86B4E4 #759FC8 #6589AD #557392 #455E77 #35485C #263341

#86B5E4 - #557392 - #263341

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #86B4E4 0%, #557392 50%, #263341 100%);
    background: -webkit-linear-gradient(top, #86B4E4 0%, #557392 50%, #263341 100%);
    background: linear-gradient(to bottom, #86B4E4 0%, #557392 50%, #263341 100%);
}
</style>