#4B898E - #0E3639 | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #4B898E to #0E3639
#4B898Eと#0E3639の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#4B898E - #0E3639 | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#4B898Eを0%、#0E3639を100%として二色間の色を展開します。
0.0% #4B898E |
RGB 75 137 142 | #4B898E |
16.7% #407B7F |
RGB 64 123 127 | #407B7F |
33.3% #366D71 |
RGB 54 109 113 | #366D71 |
50.0% #2C5F63 |
RGB 44 95 99 | #2C5F63 |
66.7% #225155 |
RGB 34 81 85 | #225155 |
83.3% #184347 |
RGB 24 67 71 | #184347 |
100.0% #0E3639 |
RGB 14 54 57 | #0E3639 |
HSVブレンド
#4B898E - #0E3639 | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#4B898Eを0%、#0E3639を100%として二色間の色を展開します。
0.0% #4B898E |
RGB 75 137 142 | #4B898E |
16.7% #3D7A7F |
RGB 61 122 127 | #3D7A7F |
33.3% #316C71 |
RGB 49 108 113 | #316C71 |
50.0% #265F63 |
RGB 38 95 99 | #265F63 |
66.7% #1C5155 |
RGB 28 81 85 | #1C5155 |
83.3% #144347 |
RGB 20 67 71 | #144347 |
100.0% #0E3639 |
RGB 14 54 57 | #0E3639 |
CSSコード
<style type="text/css"> /* RGB Gradient */ div { background: -moz-linear-gradient(top, #4B898E 0%, #0E3639 100%); background: -webkit-linear-gradient(top, #4B898E 0%, #0E3639 100%); background: linear-gradient(to bottom, #4B898E 0%, #0E3639 100%); } /* HSV Gradient */ div { background: -moz-linear-gradient(top, #4B898E 0%, #265F63 50%, #0E3639 100%); background: -webkit-linear-gradient(top, #4B898E 0%, #265F63 50%, #0E3639 100%); background: linear-gradient(to bottom, #4B898E 0%, #265F63 50%, #0E3639 100%); } </style>