配色生成器

基準の色から、補色・類似色・トライアドなどの配色パターンを作り、HEXの一覧と、色の帯のプレビューを出します。

プレビュー
色の一覧
—

計算式

使い方のヒント

配色は、メインの色を70%、サブの色を25%、アクセントの色を5%ほどで使うと、まとまりやすいと言われています。実際の見た目は、画面で確かめて、必要なら、彩度や明度を、少し調整してください。

関連ツール

よくある質問

配色生成器では何がわかりますか?

基準の色から、補色・類似色・トライアドなどの配色パターンを作り、HEXの一覧と、色の帯のプレビューを出します。

何を入力すればいいですか?

次の項目を入力します: 基準の色、配色のパターン。内容を変えると、結果もそれに合わせて変わります。

結果にはどんな項目が表示されますか?

「色の一覧」などが表示されます。

どんな計算式を使っていますか?

ページ内の「計算式」にまとめています。たとえば「補色 = 色相 + 180°、トライアド = +120°と+240°」のような式です。

入力した値は外部に送信されますか?

いいえ。処理はお使いのブラウザの中だけで行い、サーバーには送信しません。

結果はどのくらい正確ですか?

色の見え方はモニターや印刷で変わります。サイズや比率は計算どおりですが、仕上がりは実際に書き出して確認してください。

結果をコピーできますか?

はい。「結果をコピー」ボタンで、表示されている結果をクリップボードにコピーできます。

スマホでも使えますか?

はい。画面の幅に合わせて表示されます。アプリのインストールや会員登録は必要ありません。

同じカテゴリ(色・配色・グラデーション)の他のツールはありますか?

はい。HEX/RGB/HSL変換機、カラーパレット抽出、カラーピッカー、HEX→RGB→HSL変換機などがあります。

関連記事