このツールを使う理由
- ドラッグ中もHEX、RGB、HSL、HSVが同期
- 補色、類似色、トライアド、テトラードの各配色
- CSS変数、Tailwind設定、JSONへワンクリックで書き出し
色彩理論にもとづくパレット
調和のとれた配色は、色相環上の一定の関係から生まれます。補色は正反対に位置し、最大のコントラストを生みます。類似色は隣り合っていて穏やかな印象になります。トライアドは等間隔に配置され、鮮やかさを保ちながら均衡を崩しません。
よくある質問
HEXコードは何を表していますか。
赤、緑、青それぞれを00からFFまでの16進数2桁で表したものです。#FF0000は緑と青を含まない純粋な赤を意味します。
HEXではなくHSLを使うのはどんなときですか。
HSLは色相・彩度・明度を分けて扱うため、明暗の段階を作るときに新しい16進値を推測せず、数値をひとつ変えるだけで済みます。
書き出したパレットはアクセシビリティに配慮されていますか。
コントラスト比を表示するので、本文テキストのWCAG AA基準である4.5:1を満たしているか、公開前に組み合わせごとに確認できます。