配色
ベースカラーから
ご利用には NAYUTA Tools 利用規約 が
TOOL WORKSPACE
配色パレット作成
ツールを読み込んでいます…
HOW TO USE / 使い方
3ステップで使えます。
- 01
ベースカラーをカラーピッカーかHEXで指定します。
- 02
補色・類似色・トライアド・濃淡から配色の考え方を選びます。
- 03
色の値とコントラスト比を確認し、CSS変数などをコピーします。
WHAT IT DOES / できること
配色パレット作成で、できること。
ベースカラーから相性のよい色の候補を出し、文字の読みやすさとあわせて確かめながら配色を決めるためのツールです。
FOR / こんな方に
- バナーや資料をつくる販促・Web担当者
- LPやサイトを制作するデザイナー
- 配色の値を実装に渡すエンジニア
USE CASES / こんなときに
配色パレット作成を、実務でどう使うか。
- バナーやチラシの差し色選び
- LP・キャンペーンページの配色案づくり
- ブランドカラーの濃淡をCSS変数にまとめる作業
FAQ / よくある質問
使う前に知っておきたいこと。
登録は必要ですか？
不要です。NAYUTA Toolsはログインせずに使える無料Webツールです。
入力したデータは保存されますか？
このツールはブラウザ内で処理し、NAYUTAのサーバーへ入力内容を送信しません。ページを閉じると入力内容は消えます。
コントラスト比はどのくらいあればよいですか？
WCAG 2.xのAA基準では、本文の文字と背景は4.5:1以上、大きな文字は3:1以上が目安です。詳細設定で、パレットの色どうしの組み合わせの表も表示できます。
rgb()やhsl()の値から作れますか？
作れます。詳細設定の「色の値で指定」に、rgb(63, 107, 92) や hsl(160 26% 33%) の形で入力してください。
REPORT / 不具合の報告
うまく動かないとき。
SUPERVISION / 監修
監修：岸 和伸
住宅会社で注文住宅の営業を経験した後、Web・SNS・販促・マーケティングへと仕事を広げ、注文住宅に加えて分譲・不動産仲介・リフォームのWeb制作・運用に携わってきました。その後、大手不動産会社で広報・PR、ブランディング、オウンドメディアなどを担当。SNSやAI活用にも取り組んできました。住宅・不動産に携わって、約15年。
ツールの動作、表示・文言、住宅・不動産とマーケティングの実務での使い方に関する確認。計算・判定の結果は目安で、法律・税務・金融・建築等の個別専門判断を代替しない。
GUIDES / 関連ガイド
仕事で使う前に、知っておきたいこと。
- 住宅会社のWebと販促物で色をそろえる｜カラーコードの受け渡しと読みやすさの確認 NAYUTA Media
ロゴや施工写真から色を選ぶ販促担当者向けに、正本の色指定、用途別の役割、文字と背景のコントラストを確認する手順を紹介します。抽出した色をそのままブランドの正式色にしないためのガイドです。
NAYUTA TOOLS
使って
NAYUTA Toolsは、
ツールを