#B3BCB3 - #8AA28F | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #B3BCB3 to #8AA28F
#B3BCB3と#8AA28Fの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
RGBブレンド
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#B3BCB3を0%、#8AA28Fを100%として二色間の色を展開します。
0.0% #B3BCB3 |
RGB 179 188 179 | #B3BCB3 |
16.7% #ADB8AD |
RGB 173 184 173 | #ADB8AD |
33.3% #A6B4A7 |
RGB 166 180 167 | #A6B4A7 |
50.0% #9FAFA1 |
RGB 159 175 161 | #9FAFA1 |
66.7% #98AB9B |
RGB 152 171 155 | #98AB9B |
83.3% #91A795 |
RGB 145 167 149 | #91A795 |
100.0% #8AA28F |
RGB 138 162 143 | #8AA28F |
HSVブレンド
HSVブレンド
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#B3BCB3を0%、#8AA28Fを100%として二色間の色を展開します。
0.0% #B3BCB3 |
RGB 179 188 179 | #B3BCB3 |
16.7% #ABB7AC |
RGB 171 183 172 | #ABB7AC |
33.3% #A4B3A5 |
RGB 164 179 165 | #A4B3A5 |
50.0% #9DAF9F |
RGB 157 175 159 | #9DAF9F |
66.7% #97AA99 |
RGB 151 170 153 | #97AA99 |
83.3% #90A694 |
RGB 144 166 148 | #90A694 |
100.0% #8AA28F |
RGB 138 162 143 | #8AA28F |
CSSコード
<style type="text/css"> /* RGB Gradation */ div { background: -moz-linear-gradient(top, #B3BCB3 0%, #8AA28F 100%); background: -webkit-linear-gradient(top, #B3BCB3 0%, #8AA28F 100%); background: linear-gradient(to bottom, #B3BCB3 0%, #8AA28F 100%); } /* HSV Gradation */ div { background: -moz-linear-gradient(top, #B3BCB3 0%, #9DAF9F 50%, #8AA28F 100%); background: -webkit-linear-gradient(top, #B3BCB3 0%, #9DAF9F 50%, #8AA28F 100%); background: linear-gradient(to bottom, #B3BCB3 0%, #9DAF9F 50%, #8AA28F 100%); } </style>