#1A3C48 - #481A3D | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #1A3C48 to #481A3D
#1A3C48と#481A3Dの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
RGBブレンド
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#1A3C48を0%、#481A3Dを100%として二色間の色を展開します。
0.0% #1A3C48 |
RGB 26 60 72 | #1A3C48 |
16.7% #213747 |
RGB 33 55 71 | #213747 |
33.3% #293145 |
RGB 41 49 69 | #293145 |
50.0% #312B43 |
RGB 49 43 67 | #312B43 |
66.7% #382641 |
RGB 56 38 65 | #382641 |
83.3% #40203F |
RGB 64 32 63 | #40203F |
100.0% #481A3D |
RGB 72 26 61 | #481A3D |
HSVブレンド
HSVブレンド
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#1A3C48を0%、#481A3Dを100%として二色間の色を展開します。
0.0% #1A3C48 |
RGB 26 60 72 | #1A3C48 |
16.7% #1A2C48 |
RGB 26 44 72 | #1A2C48 |
33.3% #1A1D48 |
RGB 26 29 72 | #1A1D48 |
50.0% #251A48 |
RGB 37 26 72 | #251A48 |
66.7% #341A48 |
RGB 52 26 72 | #341A48 |
83.3% #431A48 |
RGB 67 26 72 | #431A48 |
100.0% #481A3D |
RGB 72 26 61 | #481A3D |
CSSコード
<style type="text/css"> /* RGB Gradation */ div { background: -moz-linear-gradient(top, #1A3C48 0%, #481A3D 100%); background: -webkit-linear-gradient(top, #1A3C48 0%, #481A3D 100%); background: linear-gradient(to bottom, #1A3C48 0%, #481A3D 100%); } /* HSV Gradation */ div { background: -moz-linear-gradient(top, #1A3C48 0%, #251A48 50%, #481A3D 100%); background: -webkit-linear-gradient(top, #1A3C48 0%, #251A48 50%, #481A3D 100%); background: linear-gradient(to bottom, #1A3C48 0%, #251A48 50%, #481A3D 100%); } </style>