配色ルールを使えるパレットにする
色相のルールは出発点です。画面で使うには、色の役割、文字のコントラスト、視覚的な階層も考えます。
基準色をひとつ決める
色を検索し、HSLのルールを選んで生成します。補色は180°、類似色は−30°/0°/+30°、トライアドは0°/120°/240°です。灰色には色相がないため、モノクロマティックで明度を試しましょう。
決めた色をロックする
残したい色をロックし、未ロックの組み合わせ色を再生成します。基準色は固定です。ルール変更後もロック色は残るので、元の幾何学的な配色と異なる場合は編集済みと表示します。
レイアウトで確認して書き出す
5種類のCSSプレビューと実際の文字色・背景色を確認し、CSS変数をコピーまたはダウンロードします。共有リンクはHEX・ロック・ルール・seedを保存しますが、データベースにプロジェクトを作るわけではありません。