色を1つ選ぶと、いちばん明るい色からいちばん暗い色までの濃淡がすぐに表示されます。色をタップするとHEXコードをコピーできます。
同じ色の仲間で作った11段階の濃淡です。番号はTailwindと同じ並びで、選んだ色はいちばん近い段階に印がつきます。
色をタップするとHEXコードをコピーできます。
1つの色から生まれる濃淡の並びです。白に近い色から黒に近い色まで、すべて同じ色相を持っています。そのため、どの色を組み合わせても自然になじみます。
ティントは色に白を混ぜたもので、明るくやわらかくなります。シェードは黒を混ぜたもので、暗く深みが出ます。トーンはグレーを混ぜたもので、落ち着いた上品な印象になります。
明るい段階（50〜200）は背景に、中間（400〜600）はボタンやリンクに、暗い段階（700〜950）は文字や枠線に使いましょう。1つのスケールだけで、統一感のある見やすい画面になります。
OKLCHという色空間を使っています。人の目が感じる明るさに近いので、段階ごとの差が均一に見え、急な変化がありません。
Tailwind CSSや多くのデザインシステムで使われている目盛りです。50がいちばん明るく、950がいちばん暗い色です。選んだ色は、いちばん近い番号に入ります。
はい。名前を入力して形式を選び、コードをコピーするだけです。そのまま貼れるCSS変数か、Tailwindの設定用のcolorsブロックを選べます。
スケールは1つの色の濃淡です。パレットは相性のいい別々の色の組み合わせです。多くのパレットでは、背景や文字にスケールを使い、アクセントに1〜2色を加えます。