#70B8FF - #00A8D3 | colorate

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

Blend #70B8FF to #00A8D3

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

RGBブレンド

#70B8FF - #00A8D3 | colorate

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

0.0%	0.0% #70B8FF	RGB 112 184 255	#70B8FF
16.7%	16.7% #5DB5F7	RGB 93 181 247	#5DB5F7
33.3%	33.3% #4AB2F0	RGB 74 178 240	#4AB2F0
50.0%	50.0% #38B0E9	RGB 56 176 233	#38B0E9
66.7%	66.7% #25ADE1	RGB 37 173 225	#25ADE1
83.3%	83.3% #12AADA	RGB 18 170 218	#12AADA
100.0%	100.0% #00A8D3	RGB 0 168 211	#00A8D3

#70B8FF #5DB5F7 #4AB2F0 #38B0E9 #25ADE1 #12AADA #00A8D3

#70B8FF - #00A8D3

HSVブレンド

#70B8FF - #00A8D3 | colorate

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

0.0%	0.0% #70B8FF	RGB 112 184 255	#70B8FF
16.7%	16.7% #5AB1F7	RGB 90 177 247	#5AB1F7
33.3%	33.3% #46ACF0	RGB 70 172 240	#46ACF0
50.0%	50.0% #33A9E9	RGB 51 169 233	#33A9E9
66.7%	66.7% #21A7E1	RGB 33 167 225	#21A7E1
83.3%	83.3% #0FA7DA	RGB 15 167 218	#0FA7DA
100.0%	100.0% #00A8D3	RGB 0 168 211	#00A8D3

#70B8FF #5AB1F7 #46ACF0 #33A9E9 #21A7E1 #0FA7DA #00A8D3

#70B8FF - #33A9E9 - #00A8D3

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #70B8FF 0%, #33A9E9 50%, #00A8D3 100%);
    background: -webkit-linear-gradient(top, #70B8FF 0%, #33A9E9 50%, #00A8D3 100%);
    background: linear-gradient(to bottom, #70B8FF 0%, #33A9E9 50%, #00A8D3 100%);
}
</style>