#000EEA - #0071FF | colorate

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

Blend #000EEA to #0071FF

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

RGBブレンド

#000EEA - #0071FF | colorate

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

0.0%	0.0% #000EEA	RGB 0 14 234	#000EEA
16.7%	16.7% #001EED	RGB 0 30 237	#001EED
33.3%	33.3% #002FF1	RGB 0 47 241	#002FF1
50.0%	50.0% #003FF4	RGB 0 63 244	#003FF4
66.7%	66.7% #0050F8	RGB 0 80 248	#0050F8
83.3%	83.3% #0060FB	RGB 0 96 251	#0060FB
100.0%	100.0% #0071FF	RGB 0 113 255	#0071FF

#000EEA #001EED #002FF1 #003FF4 #0050F8 #0060FB #0071FF

#000EEA - #0071FF

HSVブレンド

#000EEA - #0071FF | colorate

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

0.0%	0.0% #000EEA	RGB 0 14 234	#000EEA
16.7%	16.7% #001DED	RGB 0 29 237	#001DED
33.3%	33.3% #002DF1	RGB 0 45 241	#002DF1
50.0%	50.0% #003DF4	RGB 0 61 244	#003DF4
66.7%	66.7% #004EF8	RGB 0 78 248	#004EF8
83.3%	83.3% #005FFB	RGB 0 95 251	#005FFB
100.0%	100.0% #0071FF	RGB 0 113 255	#0071FF

#000EEA #001DED #002DF1 #003DF4 #004EF8 #005FFB #0071FF

#000EEA - #003DF4 - #0071FF

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #000EEA 0%, #003DF4 50%, #0071FF 100%);
    background: -webkit-linear-gradient(top, #000EEA 0%, #003DF4 50%, #0071FF 100%);
    background: linear-gradient(to bottom, #000EEA 0%, #003DF4 50%, #0071FF 100%);
}
</style>