#16188F - #BCBDDF | colorate

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

Blend #16188F to #BCBDDF

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

RGBブレンド

#16188F - #BCBDDF | colorate

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

0.0%	0.0% #16188F	RGB 22 24 143	#16188F
16.7%	16.7% #31339C	RGB 49 51 156	#31339C
33.3%	33.3% #4D4FA9	RGB 77 79 169	#4D4FA9
50.0%	50.0% #696AB7	RGB 105 106 183	#696AB7
66.7%	66.7% #8486C4	RGB 132 134 196	#8486C4
83.3%	83.3% #A0A1D1	RGB 160 161 209	#A0A1D1
100.0%	100.0% #BCBDDF	RGB 188 189 223	#BCBDDF

#16188F #31339C #4D4FA9 #696AB7 #8486C4 #A0A1D1 #BCBDDF

#16188F - #BCBDDF

HSVブレンド

#16188F - #BCBDDF | colorate

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

0.0%	0.0% #16188F	RGB 22 24 143	#16188F
16.7%	16.7% #2A2C9C	RGB 42 44 156	#2A2C9C
33.3%	33.3% #4143A9	RGB 65 67 169	#4143A9
50.0%	50.0% #5B5DB7	RGB 91 93 183	#5B5DB7
66.7%	66.7% #787AC4	RGB 120 122 196	#787AC4
83.3%	83.3% #989AD1	RGB 152 154 209	#989AD1
100.0%	100.0% #BCBDDF	RGB 188 189 223	#BCBDDF

#16188F #2A2C9C #4143A9 #5B5DB7 #787AC4 #989AD1 #BCBDDF

#16188F - #5B5DB7 - #BCBDDF

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #16188F 0%, #5B5DB7 50%, #BCBDDF 100%);
    background: -webkit-linear-gradient(top, #16188F 0%, #5B5DB7 50%, #BCBDDF 100%);
    background: linear-gradient(to bottom, #16188F 0%, #5B5DB7 50%, #BCBDDF 100%);
}
</style>