#ACE2FF - #4D9ADA | colorate

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

Blend #ACE2FF to #4D9ADA

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

RGBブレンド

#ACE2FF - #4D9ADA | colorate

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

0.0%	0.0% #ACE2FF	RGB 172 226 255	#ACE2FF
16.7%	16.7% #9CD6F8	RGB 156 214 248	#9CD6F8
33.3%	33.3% #8CCAF2	RGB 140 202 242	#8CCAF2
50.0%	50.0% #7CBEEC	RGB 124 190 236	#7CBEEC
66.7%	66.7% #6CB2E6	RGB 108 178 230	#6CB2E6
83.3%	83.3% #5CA6E0	RGB 92 166 224	#5CA6E0
100.0%	100.0% #4D9ADA	RGB 77 154 218	#4D9ADA

#ACE2FF #9CD6F8 #8CCAF2 #7CBEEC #6CB2E6 #5CA6E0 #4D9ADA

#ACE2FF - #4D9ADA

HSVブレンド

#ACE2FF - #4D9ADA | colorate

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

0.0%	0.0% #ACE2FF	RGB 172 226 255	#ACE2FF
16.7%	16.7% #9AD6F8	RGB 154 214 248	#9AD6F8
33.3%	33.3% #89CAF2	RGB 137 202 242	#89CAF2
50.0%	50.0% #79BEEC	RGB 121 190 236	#79BEEC
66.7%	66.7% #6AB2E6	RGB 106 178 230	#6AB2E6
83.3%	83.3% #5BA6E0	RGB 91 166 224	#5BA6E0
100.0%	100.0% #4D9ADA	RGB 77 154 218	#4D9ADA

#ACE2FF #9AD6F8 #89CAF2 #79BEEC #6AB2E6 #5BA6E0 #4D9ADA

#ACE2FF - #79BEEC - #4D9ADA

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ACE2FF 0%, #79BEEC 50%, #4D9ADA 100%);
    background: -webkit-linear-gradient(top, #ACE2FF 0%, #79BEEC 50%, #4D9ADA 100%);
    background: linear-gradient(to bottom, #ACE2FF 0%, #79BEEC 50%, #4D9ADA 100%);
}
</style>