カラーパレット生成
WCAG contrast: at least 4.5:1 for normal text, 3:1 for large text.
Palette
人気の開発者ツール
使い方
- 基準色(HEX)を選択/入力します。
- 配色(補色/類似/トライアド)と色数を設定します。
- パレットを生成します。
- HEX/CSS変数をコピーし、コントラスト(WCAG)を確認します。
結果の見方
- パレットはHSLの配色規則で生成されます。実際のUIでは彩度/明度を微調整するのが一般的です。
- コントラストが4.5:1未満だと通常テキストの可読性が下がる可能性があります。
- 自動テキスト色は黒/白のうちコントラストが高い方を推奨します。
- フォントサイズや背景(サーフェス色)の組み合わせで最終確認してください。
よくある質問
入力したデータはサーバーに送信されますか？
いいえ。可能な限り処理はブラウザ内（ローカル）で行い、入力値や結果をサーバーに保存しません。（ページ読み込みや広告などで通信が発生する場合があります。）
結果が想定と違う時は何を確認すればよいですか？
入力のエンコーディング(UTF‑8)、改行(CRLF/LF)、空白/引用符、オプション(大小文字、URLエンコード方式など)を確認してください。機密データはポリシーに従って扱ってください。
パレットが合わない時は？
基準色の彩度/明度を少し調整するか、配色(補色/類似/トライアド)を変えてみてください。実際のUIではコントラスト(WCAG)確認が重要です。