サイトの印象を変える「テーマカラー」の変更
最終更新日: 2025年10月23日
「Myホームページクリエイター」のテンプレートは、あらかじめ当サイト運営者が選んだ配色（テーマカラー）でデザインされています。
もし、あなたの会社やお店のロゴカラーが「赤」や「緑」の場合、このテーマカラーを変更するだけで、一瞬でオリジナルサイトの印象に変わります。
CSSの「たった1行」を変えるだけ
「よく頂く質問」でも解説している通り、当サイトのテンプレートの多くは、CSSの便利な機能（CSSカスタムプロパティ）を使って、色の管理を一元化しています。
これにより、style.css ファイルの**冒頭にある、たった1行**のコードを書き換えるだけで、サイト全体のボタンの色やアクセントカラーを一括で変更できます。
変更の手順
style.cssファイルをテキストエディタ（VSCodeなど）で開きます。- ファイルの冒頭（10行目あたり）に、以下のような記述があります。
この --primary-color: #81e8ed; が、サイトの基本色（テーマカラー）を指定している部分です（#81e8ed は水色のカラーコード）。
- この
#81e8edの部分を、あなたの使いたい色の「カラーコード（#から始まる6桁の英数字）」に書き換えて、保存します。
たったこれだけで、サイト全体の印象がガラリと変わります。例えば、#ff6347（トマト色）に変えれば、情熱的な印象のサイトになります。
カラーコードを見つけるには？
「使いたい色のカラーコードが分からない」という場合は、Web上で「カラーピッカー」と検索したり、姉妹サイトの「Myカラークリエイター」を活用したりするのがおすすめです。
このページのまとめ
style.cssの冒頭にある--primary-colorの値を変更するだけ。- たった1行の変更で、サイト全体のテーマカラーを一括変更できる。
- 使いたいカラーコードは「Myカラークリエイター」などで探せる。
Web制作者向け便利ツール
Myフォームクリエイター
PHPの知識がなくても、誰でも簡単に高機能なメールフォームが作れる無料ツール。カスタマイズも自由自在です。
My Logo Creator
登録不要で本格的なロゴを無料作成。Webサイトや名刺に使えるプロ品質のSVG形式にも対応しています。
My Canvas Creator
ブラウザ上で手軽に画像を編集・加工できるツール。SNS投稿やブログのアイキャッチ作成に役立ちます。
Myカラークリエイター
Webデザインに最適な配色が見つかるツール。アクセシビリティ対応のコントラスト比チェック機能も搭載。
My OGPクリエイター
SNSシェア時の美しいプレビューカード(OGPタグ)を、ライブプレビューを見ながら簡単に作成できます。
My Faviconクリエイター
1枚の画像やイニシャルから、あらゆるデバイスに対応したファビコン一式を瞬時に自動生成します。