#AAE5E2 - #39BCB9 | colorate

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

Blend #AAE5E2 to #39BCB9

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

RGBブレンド

#AAE5E2 - #39BCB9 | colorate

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

0.0%	0.0% #AAE5E2	RGB 170 229 226	#AAE5E2
16.7%	16.7% #97DEDB	RGB 151 222 219	#97DEDB
33.3%	33.3% #84D7D4	RGB 132 215 212	#84D7D4
50.0%	50.0% #71D0CD	RGB 113 208 205	#71D0CD
66.7%	66.7% #5EC9C6	RGB 94 201 198	#5EC9C6
83.3%	83.3% #4BC2BF	RGB 75 194 191	#4BC2BF
100.0%	100.0% #39BCB9	RGB 57 188 185	#39BCB9

#AAE5E2 #97DEDB #84D7D4 #71D0CD #5EC9C6 #4BC2BF #39BCB9

#AAE5E2 - #39BCB9

HSVブレンド

#AAE5E2 - #39BCB9 | colorate

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

0.0%	0.0% #AAE5E2	RGB 170 229 226	#AAE5E2
16.7%	16.7% #94DEDA	RGB 148 222 218	#94DEDA
33.3%	33.3% #80D7D3	RGB 128 215 211	#80D7D3
50.0%	50.0% #6CD0CC	RGB 108 208 204	#6CD0CC
66.7%	66.7% #5AC9C6	RGB 90 201 198	#5AC9C6
83.3%	83.3% #49C2BF	RGB 73 194 191	#49C2BF
100.0%	100.0% #39BCB9	RGB 57 188 185	#39BCB9

#AAE5E2 #94DEDA #80D7D3 #6CD0CC #5AC9C6 #49C2BF #39BCB9

#AAE5E2 - #6CD0CC - #39BCB9

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AAE5E2 0%, #6CD0CC 50%, #39BCB9 100%);
    background: -webkit-linear-gradient(top, #AAE5E2 0%, #6CD0CC 50%, #39BCB9 100%);
    background: linear-gradient(to bottom, #AAE5E2 0%, #6CD0CC 50%, #39BCB9 100%);
}
</style>