パレット修正ツールがチェックする内容
チェックするのは5つです。文字として読みやすい色の組み合わせがあるか、同じに見える色がないか、色覚特性のある人に2色が混同されないか、強い色が多すぎたり少なすぎたりしないか、背景や文字に使うニュートラル色があるか。それぞれの問題は、原因となっている色の上に表示されます。
色の修正方法
問題の原因となっている色の明るさや彩度を調整しますが、色相はそのまま残すので、パレットの雰囲気は変わりません。ロックした色には一切手を加えず、ニュートラル色や最も明るい色、最も暗い色も守ります。修正後にもう一度チェックし、修正が新しい問題を生まないようにします。
0〜100点のスコア
どのパレットも100点から始まり、問題ごとに減点されます。ニュートラル色がない場合の−10から、文字が読めない場合の−40まで。修正前と修正後のスコアが表示され、「スコアの計算方法」で全項目を確認できます。
よくある質問
カラーパレットを無料・オンラインで修正できますか?
はい。この修正ツールは無料で、ブラウザ上でオンラインで動きます。ダウンロードも登録も不要で、透かしも入りません。好きなだけパレットを修正して、修正前後の画像をダウンロードできます。
パレット修正ツールはどう動きますか?
文字のコントラスト、同じに見える色、色覚特性で混同される色、強すぎる色やくすんだパレット、ニュートラル色の有無をチェックします。そのうえで、問題のある色の明るさや彩度を、色相を変えずに調整します。
配色がよく見えない原因は何ですか?
原因はたいてい同じです。文字として読める組み合わせがない、2色が似すぎて1色に見える、鮮やかな色同士が競い合っている、全体が灰色っぽくアクセントがない、または背景や文字に使える白・グレー・落ち着いた暗い色がない、などです。
パレットをアクセシブルにするには?
少なくとも1組の色が、通常の文字に必要なWCAG AAの最低基準である4.5:1のコントラストに達するようにしましょう。また、色覚特性のある人にも区別できるよう、色の明るさに差をつけます。「修正する内容」で「強」を選ぶと、7:1(WCAG AAA)を目指します。
ブランドカラーが変わってしまいませんか?
ロックすれば変わりません。色の鍵アイコンをタップすると、その色はそのままで、ほかの色だけを調整します。
スコアはどう計算されますか?
どのパレットも100点から始まり、問題ごとに減点されます。ニュートラル色がない場合の−10から、文字が読めない場合の−40まで。「スコアの計算方法」で表と、あなたのパレットの減点内訳を確認できます。
画像やCoolorsのパレットも修正できますか?
はい。どんなパレットでもスクリーンショットをアップロードまたは貼り付ければ、主な5色を取り出します。Coolors、Adobe Color、CSSのHEXコードを貼り付けることもできます。