FirefoxでGoogle Chromeマテリアルデザインテーマを取得する方法

Firefoxのタブの四角形の角の外観が気に入らない場合は、ChromeのマテリアルデザインUIの丸みを帯びた外観にすることができます。

四角の見た目が気に入らない場合Firefoxのタブの隅では、ChromeのマテリアルデザインUIの丸みを帯びた外観にすることができます。また、アドレスバーの端を丸くして、Firefoxツールバーアイコンをマテリアルデザインアイコンに変換することもできます。今日は、FirefoxでChromeのマテリアルデザインUIを取得する方法を紹介します。

マテリアルデザインUIに切り替える前

マテリアルデザインUIをFirefoxに適用する前のFirefoxのタブとアイコンの外観は次のとおりです。

マテリアルデザインUIを適用する前のFirefoxの正方形タブ

次に、マテリアルデザインUIをFirefoxに適用し、丸みを帯びたコーナーとマテリアルデザインアイコンを取得します。

必要なファイルをダウンロードして抽出する

MaterialFox zipファイルをダウンロードして、必要なファイルを取得します。

Webページで[複製またはダウンロード]をクリックし、[ZIPのダウンロード]をクリックします。ファイルをハードドライブのフォルダーに保存します。

MaterialFox zipファイルをダウンロード

Windowsの組み込み抽出ツールまたは7-ZipやWinZipなどのサードパーティツールを使用してファイルを抽出します。

MaterialFox zipファイルを抽出します

Windowsの組み込み抽出ツールを使用する場合は、 ブラウズ ダウンロード場所を選択します。

をチェック 完了時に抽出ファイルを表示する ボックスをクリックすると、解凍が完了したときに、ダウンロードしたフォルダーに直接ファイルマネージャーウィンドウを開きます。クリック エキス.

Windows 10 Extractダイアログ

Firefoxプロファイルフォルダを開く

コピーします クロム からのフォルダ MaterialFoxマスター ダウンロードしたフォルダ。の クロム フォルダには userChrome.css マテリアルデザインUIをFirefoxに適用するために使用されるファイル。ただし、最初に、すでに クロム フォルダと独自のカスタム userChrome.css Firefoxプロファイルフォルダー内のファイル。

プロファイルフォルダーを開くには、エクスプローラーのアドレスバーに次のパスを入力(またはコピーして貼り付け)して、Enterキーを押します。

%appdata%MozillaFirefoxProfiles

ファイルエクスプローラーにプロファイルパスを貼り付け

Firefox内からプロファイルフォルダにアクセスすることもできます。

タイプ: about:support アドレスバーで押します 入る.

または、あなたは行くことができます Firefoxメニュー>ヘルプ>トラブルシューティング情報 そして次に、 アプリケーションの基本、クリック 開いたフォルダ の隣に プロファイルフォルダ.

Firefoxでプロファイルフォルダーを開く

Chromeプロフィールが新しいファイルエクスプローラーウィンドウで開きます。このウィンドウは開いたままにしておきます。

既存のuserChrome.cssファイルを編集する

プロファイルフォルダーにChromeフォルダーがない場合は、次のセクションに進んでください。

あなたが持っている場合 クロム プロファイルフォルダー内のフォルダーと userChrome.css chromeフォルダー内のファイル、次に既存のファイルを編集します userChrome.css ファイル。これにより、既に適用したカスタマイズが失われることはありません。

MaterialFoxマスター ダウンロードしたフォルダには クロム フォルダー userChrome.css その中にファイル。それを開く userChrome.css メモ帳などのテキストエディターでファイルを作成し、その中のすべてをコピーして、ファイルを閉じます。

次に、自分のものを開く userChrome.css ファイル( クロム テキストエディタ内のプロファイルフォルダ内のフォルダ)。の最後にコピーしたテキストを貼り付けます userChrome.css ファイルを保存し、ファイルを閉じます。

MaterialFox userChrome.cssファイルの内容をコピーする

ダウンロードしたchromeフォルダをコピーして貼り付けます

まだ持っていない場合 クロム プロファイルフォルダー内のフォルダー、新しいファイルエクスプローラーウィンドウを開き、開く MaterialFoxマスター 抽出したフォルダ。

をコピー クロム のフォルダ MaterialFoxマスター フォルダ。

MaterialFoxフォルダーにChromeフォルダーをコピーする

プロファイルフォルダーを開いて、ファイルエクスプローラーウィンドウに戻ります。

貼り付け クロム からコピーしたフォルダ MaterialFoxマスター フォルダをプロファイルフォルダに入れます。

ChromeプロファイルをFirefoxプロファイルに貼り付けます

黒いタブと奇妙に見えるアイコンを修正する

Firefoxを開いて、新しいマテリアルデザインUI設定の結果を確認します。

タブが黒で、アイコンが奇妙に見えることに気付くでしょう。

FirefoxのBlack Material Designタブ

この問題は、Firefox構成設定を使用して修正します。

タイプ: about:config Firefoxのアドレスバーで、 入る。警告メッセージが表示されます。

クリック リスクを受け入れます! 続ける。

Firefoxのabout:configに移動します

タイプ: svg.context の中に 調べる ボックス。次の設定が表示されます。

svg.context-properties.content.enabled

この設定は、 デフォルトでは、無効になっています。

この機能を有効にするには、ダブルクリックして値をに変更します 本当。環境設定を右クリックして、 トグル.

svg.context設定をダブルクリックします

他のタブに切り替えるか、Firefoxを再起動します。黒いタブと奇妙に見えるアイコンが修正されました。

Firefoxの黒いタブを修正

FirefoxのタイトルバーにWindows 10のアクセントカラーを表示する

Windows 10では、Firefoxのタイトルバーと非アクティブなタブを黒くしたくない場合は、もう1つ変更する必要があります。

クリック 設定 スタートメニューから カスタマイズ>色.

をチェック タイトルバーとウィンドウの境界 下の箱 次のサーフェスにアクセントカラーを表示する.

Windows 10でアクセントカラーオプションを表示する

FirefoxのマテリアルデザインUIをお楽しみください

これで、タブの角が丸くなり、アイコンがマテリアルデザインのようになりました。タイトルバーと非アクティブなタブには、Windows 10の設定で選択したアクセントカラーが付いています。

Firefoxのタイトルバーのアクセントカラー

FirefoxからマテリアルデザインUIをアンインストールします

タブの鋭い角とFirefoxの元のアイコンに戻りたい場合は、簡単です。次のいずれかを実行します。

  • コピーした場合 クロム からのフォルダ MaterialFoxマスター フォルダーをプロファイルフォルダーに移動し、そのchromeフォルダーを削除します。
  • からテキストをコピーした場合 userChrome.css のファイル MaterialFoxマスター フォルダに入れて自分のフォルダに貼り付けます userChrome.css ファイル、開く userChrome.css 貼り付けたテキストをファイルして削除します。
0

類似の記事

コメントを残す