#9CCAD2 - #769AB8 | colorate

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

Blend #9CCAD2 to #769AB8

#9CCAD2

#769AB8

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

RGBブレンド

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

0.0%	0.0% #9CCAD2	RGB 156 202 210	#9CCAD2
16.7%	16.7% #96C2CE	RGB 150 194 206	#96C2CE
33.3%	33.3% #90BACA	RGB 144 186 202	#90BACA
50.0%	50.0% #89B2C5	RGB 137 178 197	#89B2C5
66.7%	66.7% #83AAC1	RGB 131 170 193	#83AAC1
83.3%	83.3% #7DA2BD	RGB 125 162 189	#7DA2BD
100.0%	100.0% #769AB8	RGB 118 154 184	#769AB8

#9CCAD2 #96C2CE #90BACA #89B2C5 #83AAC1 #7DA2BD #769AB8

#9CCAD2 - #769AB8

HSVブレンド

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

0.0%	0.0% #9CCAD2	RGB 156 202 210	#9CCAD2
16.7%	16.7% #95C2CD	RGB 149 194 205	#95C2CD
33.3%	33.3% #8EBAC9	RGB 142 186 201	#8EBAC9
50.0%	50.0% #88B2C5	RGB 136 178 197	#88B2C5
66.7%	66.7% #82AAC0	RGB 130 170 192	#82AAC0
83.3%	83.3% #7BA2BC	RGB 123 162 188	#7BA2BC
100.0%	100.0% #769AB8	RGB 118 154 184	#769AB8

#9CCAD2 #95C2CD #8EBAC9 #88B2C5 #82AAC0 #7BA2BC #769AB8

#9CCAD2 - #88B2C5 - #769AB8

CSSコード

<style type="text/css">
/* RGB Gradation */             
div {
    background: -moz-linear-gradient(top, #9CCAD2 0%, #769AB8 100%);
    background: -webkit-linear-gradient(top, #9CCAD2 0%, #769AB8 100%);
    background: linear-gradient(to bottom, #9CCAD2 0%, #769AB8 100%);  
}       

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #9CCAD2 0%, #88B2C5 50%, #769AB8 100%);
    background: -webkit-linear-gradient(top, #9CCAD2 0%, #88B2C5 50%, #769AB8 100%);
    background: linear-gradient(to bottom, #9CCAD2 0%, #88B2C5 50%, #769AB8 100%); 
}
</style>