#008BD6 - #7BE1ED | colorate

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

Blend #008BD6 to #7BE1ED

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

RGBブレンド

#008BD6 - #7BE1ED | colorate

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

0.0%	0.0% #008BD6	RGB 0 139 214	#008BD6
16.7%	16.7% #1499D9	RGB 20 153 217	#1499D9
33.3%	33.3% #29A7DD	RGB 41 167 221	#29A7DD
50.0%	50.0% #3DB6E1	RGB 61 182 225	#3DB6E1
66.7%	66.7% #52C4E5	RGB 82 196 229	#52C4E5
83.3%	83.3% #66D2E9	RGB 102 210 233	#66D2E9
100.0%	100.0% #7BE1ED	RGB 123 225 237	#7BE1ED

#008BD6 #1499D9 #29A7DD #3DB6E1 #52C4E5 #66D2E9 #7BE1ED

#008BD6 - #7BE1ED

HSVブレンド

#008BD6 - #7BE1ED | colorate

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

0.0%	0.0% #008AD6	RGB 0 138 214	#008AD6
16.7%	16.7% #129CD9	RGB 18 156 217	#129CD9
33.3%	33.3% #26ACDD	RGB 38 172 221	#26ACDD
50.0%	50.0% #3ABBE1	RGB 58 187 225	#3ABBE1
66.7%	66.7% #4FC9E5	RGB 79 201 229	#4FC9E5
83.3%	83.3% #64D5E9	RGB 100 213 233	#64D5E9
100.0%	100.0% #7BE1ED	RGB 123 225 237	#7BE1ED

#008AD6 #129CD9 #26ACDD #3ABBE1 #4FC9E5 #64D5E9 #7BE1ED

#008BD6 - #3ABBE1 - #7BE1ED

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #008AD6 0%, #3ABBE1 50%, #7BE1ED 100%);
    background: -webkit-linear-gradient(top, #008AD6 0%, #3ABBE1 50%, #7BE1ED 100%);
    background: linear-gradient(to bottom, #008AD6 0%, #3ABBE1 50%, #7BE1ED 100%);
}
</style>