#0A0055 - #5E77AF | colorate

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

Blend #0A0055 to #5E77AF

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

RGBブレンド

#0A0055 - #5E77AF | colorate

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

0.0%	0.0% #0A0055	RGB 10 0 85	#0A0055
16.7%	16.7% #181364	RGB 24 19 100	#181364
33.3%	33.3% #262773	RGB 38 39 115	#262773
50.0%	50.0% #343B82	RGB 52 59 130	#343B82
66.7%	66.7% #424F91	RGB 66 79 145	#424F91
83.3%	83.3% #5063A0	RGB 80 99 160	#5063A0
100.0%	100.0% #5E77AF	RGB 94 119 175	#5E77AF

#0A0055 #181364 #262773 #343B82 #424F91 #5063A0 #5E77AF

#0A0055 - #5E77AF

HSVブレンド

#0A0055 - #5E77AF | colorate

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

0.0%	0.0% #0A0055	RGB 10 0 85	#0A0055
16.7%	16.7% #0D0864	RGB 13 8 100	#0D0864
33.3%	33.3% #141673	RGB 20 22 115	#141673
50.0%	50.0% #222B82	RGB 34 43 130	#222B82
66.7%	66.7% #334391	RGB 51 67 145	#334391
83.3%	83.3% #475CA0	RGB 71 92 160	#475CA0
100.0%	100.0% #5E77AF	RGB 94 119 175	#5E77AF

#0A0055 #0D0864 #141673 #222B82 #334391 #475CA0 #5E77AF

#0A0055 - #222B82 - #5E77AF

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0A0055 0%, #222B82 50%, #5E77AF 100%);
    background: -webkit-linear-gradient(top, #0A0055 0%, #222B82 50%, #5E77AF 100%);
    background: linear-gradient(to bottom, #0A0055 0%, #222B82 50%, #5E77AF 100%);
}
</style>