TECH BLOG

マークリープス技術ブログ

open

真っ黒(#000)に代わる黒系文字色の選び方

ウェブデザインで文字色に真っ黒(#000)の使用を避けたい場合、柔らかさや個性を感じさせる黒やダークカラーを使うことで、より洗練された印象を与えることができます。

ソフトな黒系

真っ黒より少し明るい色味で、目に優しい印象を与えます。

#111111: 真っ黒に近いが、わずかに柔らかい。

#1A1A1A: 少し明るめのダークグレーで、強すぎないトーン。

#2E2E2E: 柔らかさが際立つ落ち着いたグレー。

ニュートラルなダークグレー

真っ黒ほど主張が強くなく、読みやすさも損なわないバランスの取れた色です。

#333333: 汎用性の高い標準的なダークグレー。

#4A4A4A: 少し軽やかな印象で、フラットデザインに最適。

#666666: 中間的なグレーで、目に優しく、軽い雰囲気を演出。

暖色寄りの黒

赤みを含む黒は、暖かみと親しみやすさを感じさせます。

#1C1C1C: わずかに赤みを帯びた柔らかな黒。

#292929: 高級感を与える落ち着いたトーン。

#3F3F3F: 微妙な暖かみがあり、親しみやすさをプラス。

クールトーンの黒

青みや緑みをわずかに含む黒は、洗練されたモダンな印象を与えます。

#0F0F0F: 青みをわずかに含んだクールな黒。

#202124: GoogleのUIデザインでよく使われるクールなダークトーン。

#282A36: ドラキュラテーマなどで使われる青紫がかった黒。

文字色選びのポイント

1.コントラストを確保する
背景色と文字色のコントラストを十分に確保し、文字の可読性を高めることが重要です。

2.サイト全体のトーンと統一する
サイト全体の雰囲気やテーマカラーに合わせ、暖色系・クール系を選ぶことで統一感が生まれます。

 
適切な黒を選ぶことで、デザインの目的やターゲットに合った洗練された印象を与えることができます。
柔らかさや個性をプラスして、サイト全体の完成度を高めましょう。

よく読まれている関連記事

関連最新記事