#3F5E3C - #A69B6E | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #3F5E3C to #A69B6E
#3F5E3Cと#A69B6Eの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#3F5E3C - #A69B6E | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#3F5E3Cを0%、#A69B6Eを100%として二色間の色を展開します。
0.0% #3F5E3C |
RGB 63 94 60 | #3F5E3C |
16.7% #506844 |
RGB 80 104 68 | #506844 |
33.3% #61724C |
RGB 97 114 76 | #61724C |
50.0% #727C55 |
RGB 114 124 85 | #727C55 |
66.7% #83865D |
RGB 131 134 93 | #83865D |
83.3% #949065 |
RGB 148 144 101 | #949065 |
100.0% #A69B6E |
RGB 166 155 110 | #A69B6E |
HSVブレンド
#3F5E3C - #A69B6E | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#3F5E3Cを0%、#A69B6Eを100%として二色間の色を展開します。
0.0% #3F5E3C |
RGB 63 94 60 | #3F5E3C |
16.7% #4E6A44 |
RGB 78 106 68 | #4E6A44 |
33.3% #5F764C |
RGB 95 118 76 | #5F764C |
50.0% #718254 |
RGB 113 130 84 | #718254 |
66.7% #858E5C |
RGB 133 142 92 | #858E5C |
83.3% #9A9965 |
RGB 154 153 101 | #9A9965 |
100.0% #A69B6E |
RGB 166 155 110 | #A69B6E |
CSSコード
<style type="text/css"> /* RGB Gradient */ div { background: -moz-linear-gradient(top, #3F5E3C 0%, #A69B6E 100%); background: -webkit-linear-gradient(top, #3F5E3C 0%, #A69B6E 100%); background: linear-gradient(to bottom, #3F5E3C 0%, #A69B6E 100%); } /* HSV Gradient */ div { background: -moz-linear-gradient(top, #3F5E3C 0%, #718254 50%, #A69B6E 100%); background: -webkit-linear-gradient(top, #3F5E3C 0%, #718254 50%, #A69B6E 100%); background: linear-gradient(to bottom, #3F5E3C 0%, #718254 50%, #A69B6E 100%); } </style>