カラー設定

目次

SWELLでのカラー設定における重要ポイント

WordPressテーマ「SWELL」でサイトのデザインを整える際、配色をあらかじめ決めておくことは全体の統一感を出すために非常に重要です。初期設定の段階で適切な場所にカラーコードを反映させることで、洗練されたサイトデザインの土台を作ることができます。

1. メインカラーはテーマカスタマイザーで一括設定

サイトの印象を決定づけるメインカラー(#cf9f96)は、「外観」>「カスタマイズ」>「サイト全体設定」>「基本カラー」から設定するのがベストです。これにより、サイト内の重要な見出しやボタンに自動で色が反映されます。

2. テキスト色と背景色のバランス

文字色には真っ黒ではなく、少し赤みや温かみのあるウォーム・グレー(#716a67)を採用することで、視認性を高く保ちつつ、女性向けメディアのような優しい雰囲気を演出できます。全体のベースとなる背景色(#ead7cc)とのコントラストを意識することが大切です。

3. リンクカラーにはグリーンがかったブルーを推奨

初期状態の水色のリンクカラーは全体のトーンから浮いてしまうため、少しグリーンを含んだ「スモーキー・ティール(#4c7375)」などのくすみカラーに変更します。これにより、お洒落な世界観を壊さずに「クリックできる場所」を読者に分かりやすく伝えることができます。

4. カラーパレットへの登録で執筆を効率化

決定した3つのカラーコードは、「SWELL設定」の「エディター設定」内にあるカラーパレットにあらかじめ登録しておきます。記事を書く際に、いつでもマウス操作だけでお気に入りの色を呼び出せるようになり、今後の作業効率が劇的に向上します。

目次