#3F6B2F - #C2B959 | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #3F6B2F to #C2B959
#3F6B2Fと#C2B959の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#3F6B2F - #C2B959 | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#3F6B2Fを0%、#C2B959を100%として二色間の色を展開します。
0.0% #3F6B2F |
RGB 63 107 47 | #3F6B2F |
16.7% #547836 |
RGB 84 120 54 | #547836 |
33.3% #6A853D |
RGB 106 133 61 | #6A853D |
50.0% #809244 |
RGB 128 146 68 | #809244 |
66.7% #969F4B |
RGB 150 159 75 | #969F4B |
83.3% #ACAC52 |
RGB 172 172 82 | #ACAC52 |
100.0% #C2B959 |
RGB 194 185 89 | #C2B959 |
HSVブレンド
#3F6B2F - #C2B959 | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#3F6B2Fを0%、#C2B959を100%として二色間の色を展開します。
0.0% #3F6B2F |
RGB 63 107 47 | #3F6B2F |
16.7% #517935 |
RGB 81 121 53 | #517935 |
33.3% #65883C |
RGB 101 136 60 | #65883C |
50.0% #7B9643 |
RGB 123 150 67 | #7B9643 |
66.7% #94A54A |
RGB 148 165 74 | #94A54A |
83.3% #AEB351 |
RGB 174 179 81 | #AEB351 |
100.0% #C2B959 |
RGB 194 185 89 | #C2B959 |
CSSコード
<style type="text/css"> /* RGB Gradient */ div { background: -moz-linear-gradient(top, #3F6B2F 0%, #C2B959 100%); background: -webkit-linear-gradient(top, #3F6B2F 0%, #C2B959 100%); background: linear-gradient(to bottom, #3F6B2F 0%, #C2B959 100%); } /* HSV Gradient */ div { background: -moz-linear-gradient(top, #3F6B2F 0%, #7B9643 50%, #C2B959 100%); background: -webkit-linear-gradient(top, #3F6B2F 0%, #7B9643 50%, #C2B959 100%); background: linear-gradient(to bottom, #3F6B2F 0%, #7B9643 50%, #C2B959 100%); } </style>