カラーパレット

カラーパレット修正ツール

無料で使えるオンラインのカラーパレット修正ツール。色を追加すると問題点を見つけ、パレットの雰囲気を保ったまま修正します。

✓ 無料・オンライン · 登録不要

例を試す:

修正前

修正後

    ジェネレーターで開く
    修正する内容
    修正の強さ
    スコアの計算方法

    パレット修正ツールがチェックする内容

    チェックするのは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コードを貼り付けることもできます。

    ほかのガイドとツール

    次はこれを試してみよう

    名前からパレットを作る名前の文字から、あなただけの配色を作るスマホ壁紙カレンダー祝日入りの月めくり待ち受けを作るAdobe用カラーパレットパレットを.ASEでダウンロードしてPhotoshopやIllustratorで使えます
    無料診断・ツールをすべて見る →