#0062A8 - #ACEEE4 | colorate

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

Blend #0062A8 to #ACEEE4

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

RGBブレンド

#0062A8 - #ACEEE4 | colorate

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

0.0%	0.0% #0062A8	RGB 0 98 168	#0062A8
16.7%	16.7% #1C79B2	RGB 28 121 178	#1C79B2
33.3%	33.3% #3990BC	RGB 57 144 188	#3990BC
50.0%	50.0% #56A8C6	RGB 86 168 198	#56A8C6
66.7%	66.7% #72BFD0	RGB 114 191 208	#72BFD0
83.3%	83.3% #8FD6DA	RGB 143 214 218	#8FD6DA
100.0%	100.0% #ACEEE4	RGB 172 238 228	#ACEEE4

#0062A8 #1C79B2 #3990BC #56A8C6 #72BFD0 #8FD6DA #ACEEE4

#0062A8 - #ACEEE4

HSVブレンド

#0062A8 - #ACEEE4 | colorate

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

0.0%	0.0% #0062A8	RGB 0 98 168	#0062A8
16.7%	16.7% #1580B3	RGB 21 128 179	#1580B3
33.3%	33.3% #2E9EBF	RGB 46 158 191	#2E9EBF
50.0%	50.0% #49B9CB	RGB 73 185 203	#49B9CB
66.7%	66.7% #67D2D6	RGB 103 210 214	#67D2D6
83.3%	83.3% #88E2DD	RGB 136 226 221	#88E2DD
100.0%	100.0% #ACEEE4	RGB 172 238 228	#ACEEE4

#0062A8 #1580B3 #2E9EBF #49B9CB #67D2D6 #88E2DD #ACEEE4

#0062A8 - #49B9CB - #ACEEE4

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0062A8 0%, #49B9CB 50%, #ACEEE4 100%);
    background: -webkit-linear-gradient(top, #0062A8 0%, #49B9CB 50%, #ACEEE4 100%);
    background: linear-gradient(to bottom, #0062A8 0%, #49B9CB 50%, #ACEEE4 100%);
}
</style>