みやすさデザインラボ
好きな色を選ぶだけで、文字の読みやすさやデザインの印象をその場で見比べられます。サイトやバナーの色に迷ったとき、まずは気になる雰囲気から試してみてください。
よさそうな組み合わせが見つかったら、最後にCSSをコピーして制作に使えます。
最初は、左の雰囲気ボタンを押すだけでOKです。
気に入った方向性が見つかったら、色やフォントを少しずつ調整できます。
合いそうな色を選ぶ
好きな色をもとに、相性のよい候補を並べています。左で使い道を選んでから、気になる色を押してください。
今は背景色に入ります
プレビュー
配色と文字の表示サンプル
読みやすさチェック
背景と文字
--
ボタンと文字
--
判定
--
見え方チェック
色が違って見えても、文字やボタンが区別しやすいかを確認します。
この表示は配色確認のための簡易シミュレーションです。実際の見え方には個人差があります。
おすすめパターンを比べる
同じ文章を、用途の違う配色パターンで見比べられます。気に入ったものは「適用」で反映できます。
CSS出力
今の設定をコピーして制作に使えます。迷ったらCSS変数のままでOKです。