#3C564E - #C7CECA | colorate

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

Blend #3C564E to #C7CECA

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

RGBブレンド

#3C564E - #C7CECA | colorate

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

0.0%	0.0% #3C564E	RGB 60 86 78	#3C564E
16.7%	16.7% #536A62	RGB 83 106 98	#536A62
33.3%	33.3% #6A7E77	RGB 106 126 119	#6A7E77
50.0%	50.0% #81928C	RGB 129 146 140	#81928C
66.7%	66.7% #98A6A0	RGB 152 166 160	#98A6A0
83.3%	83.3% #AFBAB5	RGB 175 186 181	#AFBAB5
100.0%	100.0% #C7CECA	RGB 199 206 202	#C7CECA

#3C564E #536A62 #6A7E77 #81928C #98A6A0 #AFBAB5 #C7CECA

#3C564E - #C7CECA

HSVブレンド

#3C564E - #C7CECA | colorate

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

0.0%	0.0% #3C564E	RGB 60 86 78	#3C564E
16.7%	16.7% #4E6A60	RGB 78 106 96	#4E6A60
33.3%	33.3% #637E73	RGB 99 126 115	#637E73
50.0%	50.0% #799287	RGB 121 146 135	#799287
66.7%	66.7% #91A69C	RGB 145 166 156	#91A69C
83.3%	83.3% #ABBAB2	RGB 171 186 178	#ABBAB2
100.0%	100.0% #C7CECA	RGB 199 206 202	#C7CECA

#3C564E #4E6A60 #637E73 #799287 #91A69C #ABBAB2 #C7CECA

#3C564E - #799287 - #C7CECA

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C564E 0%, #799287 50%, #C7CECA 100%);
    background: -webkit-linear-gradient(top, #3C564E 0%, #799287 50%, #C7CECA 100%);
    background: linear-gradient(to bottom, #3C564E 0%, #799287 50%, #C7CECA 100%);
}
</style>