Google Chromeテーマの自作方法|Theme Creatorでオリジナルデザインを作ろう

ポイント

• Chrome Theme Creatorページにアクセスし、「Add to Chrome(Chromeに追加)」→「Add app(アプリを追加)」→「Theme Creator」の順に選択して、テーマに名前を付けます。
• 「Upload an Image(画像をアップロード)」を選択し、必要に応じて調整を行います。その後「Generate Colors(色を生成)」を選択し、「Basic(基本)」タブから「Pack and Install(パックしてインストール)」→「Keep(保持)」を選択します。
• Chromeメニュー→「その他のツール」→「拡張機能」を開き、「デベロッパーモード」をオンにします。CRXファイルをブラウザウィンドウにドラッグし、「テーマを追加」を選択すれば完了です。

この記事では、Google Theme Creatorを使ってGoogle Chromeのテーマを自作する方法を解説します。ここで紹介する手順は、すべてのOSに対応したGoogle Chromeデスクトップ版で利用できます。

Google Chromeテーマの作り方

Google Chromeには魅力的なテーマが数多く公開されていますが、実は自分だけのオリジナルテーマを作ることも可能です。Chrome用拡張機能「Google Theme Creator」を使えば、シンプルなグラフィカルインターフェースから、誰でも簡単に独自のテーマを作成・書き出しできます。

以下の手順で、Chrome Theme Creatorを使ってChromeをカスタマイズしてみましょう。

1. Chrome Theme Creatorのページにアクセスし、「Add to Chrome」を選択します。

2. 「Add app」を選択して、Theme Creatorをインストールします。

3. Chromeが自動的にアプリタブを開きます。「Theme Creator」を選択しましょう。

4. ページ左上の入力欄に、新しく作るテーマの名前を入力します。

5. 「Upload an image」を選択し、テーマのベースとなる高解像度の画像を選びます。
   ※Unsplashなどのフリー素材サイトなら、商用利用可能な高品質な画像を無料で多数見つけられます。特にベクター調のパターン画像は仕上がりがきれいなのでおすすめです。

6. 画像をアップロードすると、画面右側にプレビューが表示されます。画像の下にあるコントロールを使って、位置・サイズ・繰り返し表示などを自由に調整できます。

7. 「Generate Colors」を選択すると、アップロードした画像をもとにテーマ全体のカラースキームが自動生成されます。プレビューも自動的に更新され、画像から検出された色が反映されます。

8. 色を細かく変更したい場合は、「Colors」タブを開きます。このタブでは、ブラウザウィンドウ内の各要素の色を一つずつお好みに変更できます。

9. 「Basic」タブに移動し、「Pack and Install」を選択すると、作成したテーマがChrome用の拡張機能としてパッケージ化されます。

10. ダウンロード時に、Chromeから「悪意のある拡張機能がコンピュータに損害を与える可能性があります」という警告が表示されることがあります。これは通常の確認メッセージなので、「Keep(保持)」を選択してテーマファイルを保存します。

11. Chromeメニュー→「その他のツール」→「拡張機能」を開き、右上の「デベロッパーモード」のトグルスイッチをオンにします。

12. パソコン上に保存したCRXファイルを見つけて、ブラウザウィンドウへドラッグ&ドロップします。

13. ポップアップウィンドウが表示されたら、「テーマを追加」を選択します。
    ※「cannot decode image(画像をデコードできません)」というエラーが出た場合は、使用している画像に問題があるため、別の画像に差し替えてください。

14. Chromeがテーマを適用するまで数秒かかります。元のデフォルト表示に戻したい場合は、「元に戻す(Undo)」を選択すればすぐに解除できます。