【Chrome】クリックすると出る黒い枠(ハイライト)を消す方法

この記事では、Google Chromeでリンクやテキストボックスをクリックしたときに表示される黒い枠(ハイライト表示)を消す方法を解説します。この枠は、正式には「フォーカス中の項目をハイライト表示する」という機能によるものです。

「いつの間にかChromeでボタンを押すと黒い枠が付くようになった」「デザインが崩れたのかと思った」という声を耳にすることがあります。特に、自分のPCだけ表示が違って戸惑うケースも少なくありません。

情シスとして社内PCのサポートをしていると、部署内の複数人から同じ質問を受けることがあります。原因の多くはChromeのユーザー補助機能によるもので、該当設定をオフにすればほとんどの場合解消します。

ただし、特定のサイトだけで枠が出ている場合は、サイト側の作りが影響しているため、Chromeの設定を変えても解消しません。原因の見分け方から、設定で消せる場合の手順、消えないときの対処法までを順に説明します。

目次

Chromeでクリックすると黒い枠(ハイライト表示)が出る原因

Chromeでリンクやテキストボックスをクリックしたとき、黒い太枠で囲まれたように見える場合があります。これは故障ではなく、キーボード操作向けのユーザー補助機能によるものです。このような表示になる原因は、大きく次の2パターンに分かれます。まずはどちらのケースに当てはまるか、順に確認していきましょう。

すべてのサイトで黒い枠が出る場合

Chromeのユーザー補助機能が影響している可能性が高く、該当設定をオフにすれば解消します。

特定のサイトだけで黒い枠が出る場合

サイトごとの実装によるもので、Chrome側の設定変更では解消できません。

すべてのサイトで黒い枠が出るのであれば、Chrome自体のユーザー補助機能がオンになっているケースがほとんどです。該当する設定は「フォーカス中の項目をハイライト表示する」という項目です。キーボード操作でWebページを閲覧する人向けに、選択中の位置を分かりやすく示す目的で用意されています。オンになっていると、マウスでのクリック操作やTabキーでの移動時に、選択中の要素の周囲へ黒い枠が表示されます。

Google Chromeでリンクをクリックした際に、対象の周囲へ黒い枠(ハイライト表示)が表示された状態のスクリーンショット
クリックした要素(検索ボックス)の周囲に黒い枠が表示された状態

これに対して、一部のサイトだけで枠が出る場合は事情が別です。サイト制作者がリンクやボタンの選択位置を伝えるために、独自に枠線を用意していることが原因です。この場合はサイト側の実装によるものなので、Chromeの設定を変更しても表示は消えません。

いずれのケースであっても、この枠自体はページの閲覧・操作に支障をきたすものではありません。

このあと、Chrome本体の設定が原因になっているケース、つまりユーザー補助機能をオフにする手順から説明します。サイト側が原因で解消できないケースについても、後半で扱います。

クリックすると出る黒い枠を消す方法

クリックすると出る黒い枠を消す方法は、Chromeの「ユーザー補助機能」にある設定をオフにするだけです。パソコン操作に不慣れな方でも、3ステップで設定を変更できます。

  1. Chrome右上の「⋮(三点リーダー)」をクリックし、「設定」を開く
  2. 左側の「ユーザー補助機能」をクリックする
  3. 「フォーカス中の項目をハイライト表示する」をオフにする

実際の画面を見ながら詳しく解説していきます。

STEP
Chrome右上の「︙(三点リーダー)」から「設定」を選択

Chrome右上にある「︙(三点リーダー)」をクリックし、表示されたメニューから、「設定」を選択してください。

「︙(三点リーダー)」などの、よく見かけるけど読み方のわからない記号はこちらで色々ご紹介しています。興味のある方はぜひご覧ください。

Chrome右上の「⋮(三点リーダー)」をクリックし、メニューから「設定」を選択しているスクリーンショット
「⋮」をクリックして「設定」を選択する
STEP
「ユーザー補助機能」をクリック

Chromeの設定画面が表示されたら、左側にある「ユーザー補助機能」をクリックしてください。

Chromeの設定画面左側にある「ユーザー補助機能」をクリックしているスクリーンショット
設定画面左側の「ユーザー補助機能」をクリックする
STEP
「フォーカス中の項目をハイライト表示する」をオフにする

「ユーザー補助機能」をクリックすると、「ユーザー補助機能」と書かれたChromeの設定画面に移動します。

この画面はChromeのアドレスバーにchrome://settings/accessibilityと入力してEnterキーを押すことで直接開けます。

その中にある「フォーカス中の項目をハイライト表示する」をオフ(グレーの状態)にしてください。

これでリンクやテキストボックスをクリックしたときに表示される黒い枠が非表示になります。

「ユーザー補助機能」の設定画面で「フォーカス中の項目をハイライト表示する」をオフにして黒い枠が非表示になったスクリーンショット
「フォーカス中の項目をハイライト表示する」をオフにする

設定をオフにしても黒い枠・黒い四角が消えない場合の対処法

ユーザー補助機能をオフにしても黒い枠が消えない場合は、まず別のWebサイトでも同じ枠が表示されるか確認してください。特定のWebサイトだけで表示される場合は、そのサイト側のデザインによるもので、Chromeの設定では解消できません。複数のWebサイトで黒い枠が表示される場合は、次の対処法を順番に試してください。

Chromeを再起動する

複数のWebサイトで黒い枠が表示され、表示のされ方が不自然な場合があります。この場合はChromeの一時的な不具合が原因になっていることがあります。まずはChromeを再起動し、症状が改善するか確認してください。

  1. 開いているChromeのウィンドウをすべて閉じる
  2. あらためてChromeを起動し、黒い枠が消えたか確認する

閉じても改善しない場合は、タスクマネージャーを開き、Chromeに関連するプロセスをすべて終了してから、再度起動してみてください。

タスクマネージャーの開き方について詳しくは「【Windows11】タスクマネージャーを開く方法」で解説しています。

Chromeの拡張機能をすべてオフ(無効)にする

Chromeを再起動しても黒い枠が消えない場合は、拡張機能が影響している可能性があります。インストール済みの拡張機能がWebページの表示に干渉していることがあります。原因を切り分けるため、拡張機能をいったんすべてオフにして、症状が変わるか確認してください。

  1. アドレスバーにchrome://extensions/と入力してEnterキーを押す
  2. 拡張機能の一覧が表示されるので、それぞれのトグルをオフにする
  3. Chromeを再起動し、黒い枠が消えたか確認する

拡張機能の無効化方法について詳しくは「【Chrome】拡張機能(アドオン)を無効化・停止する方法」で解説しています。

消えた場合は、拡張機能を1つずつオンに戻して、原因になっている拡張機能を特定してください。すべての拡張機能をオフにしても黒い枠が消えない場合は、Chromeの初期化を試してください。

Chromeを初期化(リセット)する

再起動や拡張機能のオフでも黒い枠が消えない場合は、Chrome本体の設定に問題が発生している可能性があります。以下の手順でChromeを初期化し、症状が改善するか確認してください。

  1. 右上の「︙(縦の三点リーダー)」から「設定」を開く
  2. 左側の「設定のリセット」をクリックする
  3. 「設定を元の既定値に戻す」をクリックし、確認画面で「設定のリセット」を選択する

初期化の詳しい手順と影響範囲については「Chrome初期化ガイド:設定リセットでブラウザを快適にする方法」で解説しています。

初期化を行っても、ブックマークやパスワード、閲覧履歴などの主要なデータはそのまま残ります。一方で、拡張機能は無効になり、テーマも初期状態に戻るため、初期化後にあらためて確認してください。

Chromeの黒い枠(ハイライト表示)に関するよくある質問と答え

Chromeの黒い枠(ハイライト表示)に関するよくある質問と答えをまとめました。

Chromeでクリックすると出る黒い枠を消すには、どうすればいいですか?

Chromeの「ユーザー補助機能」にある「フォーカス中の項目をハイライト表示する」という設定をオフにすると消せます。
Chrome右上の「⋮(三点リーダー)」から「設定」を開き、左側の「ユーザー補助機能」をクリックしてください。表示された画面で「フォーカス中の項目をハイライト表示する」をオフにすると、黒い枠が表示されなくなります。

「フォーカス中の項目をハイライト表示する」の設定は、どこから開けますか?

Chromeのアドレスバーにchrome://settings/accessibilityと入力してEnterキーを押すと、直接開けます。
メニューからたどる場合は、Chrome右上の「⋮(三点リーダー)」→「設定」→「ユーザー補助機能」の順に進んでください。

Tabキーで画面を移動したときにも黒い枠は出ますか?

はい、マウスでのクリック操作だけでなく、Tabキーでの移動時にも同じ黒い枠が表示されます。
これは、キーボード操作でWebページを閲覧する人が、いま選択している位置を把握しやすくするためのユーザー補助機能です。

「フォーカス中の項目をハイライト表示する」の設定をオフにしても黒い枠が消えません。なぜですか?

特定のWebサイトだけで黒い枠が表示されている場合は、Chromeの設定ではなく、そのサイト側のデザインが原因です。
サイト制作者がリンクやボタンの選択位置を伝えるために独自の枠線を用意していることがあり、この場合はChromeの「ユーザー補助機能」をオフにしても解消しません。

この黒い枠と、Microsoft Edgeで表示される白黒の枠は同じものですか?

はい、どちらもキーボード操作向けのフォーカス表示機能で、役割は同じです。
ChromeとEdgeは同じChromiumがベースですが設定名と見た目が異なり、Chromeは「フォーカス中の項目をハイライト表示する」で黒い枠、Edgeは「フォーカスされたオブジェクトの可視性の高いアウトラインを表示する」で白黒のアウトラインが表示されます。
Edge版の対処法はクリックすると出る白黒の枠を消す方法で解説しています。

この黒い枠と、Windows11のナレーターで表示される青い枠は同じ機能ですか?

いいえ、別の機能です。
Chromeの黒い枠はブラウザ単位のユーザー補助機能ですが、ナレーターの青い枠はWindows11のスクリーンリーダー機能で、画面上の要素を読み上げながら囲んで示すものです。
ナレーターの青い枠が気になる場合はナレーターを無効にする方法をご覧ください。

特定のサイトだけ黒い枠が出る場合、消す方法はありますか?

いいえ、Chromeの標準設定では消せません。
サイト制作者が独自に用意している枠線のため、Chrome本体の設定を変更しても消えません。動作に害はないため、無理に消す必要はありませんが、どうしても消したい場合はStylebotのようなカスタムCSSを適用できる拡張機能を使う方法もあります。ただしサイトごとにCSSの知識が必要になるため、上級者向けの方法です。

会社支給のパソコンで拡張機能をオフにできません。どうすればいいですか?

組織のポリシーによって拡張機能の変更が制限されている可能性があります。
情シス担当者や管理者に、黒い枠の症状と試した対処法を伝えたうえで、拡張機能の設定変更を依頼してください。

黒い枠の色や太さを変更することはできますか?

いいえ、Chromeの標準設定では色や太さを変更できません。
設定でできるのは「フォーカス中の項目をハイライト表示する」のオン(表示)とオフ(非表示)の切り替えのみです。

最後までご覧いただき、ありがとうございました。
記事の内容は独自検証に基づくものであり、MicrosoftやAdobeなど各ベンダーの公式見解ではありません。

記事内で紹介している手順はあくまで一例です。OSのバージョンやPC環境によって操作画面・手順が異なる場合があり、目的に応じた最適な方法も環境ごとに異なります。参考のうえご利用ください。

誤りのご指摘・追記のご要望・記事のご感想は、記事のコメント欄またはこちらのお問い合わせフォームからお寄せください。個人の方向けには、トラブルの切り分けや設定アドバイスも実施します。

※Microsoft、Windows、Adobe、Acrobat、Creative Cloud、Google Chromeほか記載の製品名・サービス名は各社の商標または登録商標です。

公式情報・関連資料と検証環境
公式情報・関連資料
実行環境詳細と検証日
  • OS:Windows 11 Home 25H2(64bit)
    ※本記事の手順は Windows11 Home / Pro / Enterpriseで共通です(ポリシーで制限された環境を除く)。
  • ハードウェア:Intel(R) Core(TM) Ultra 7 155H (1.40 GHz) / 32GB RAM
  • Google Chrome:150.0.7871.187(公式ビルド) (64 ビット)
  • 最終検証日:2026年8月3日
よかったらシェアしてね!
  • URLをコピーしました!

この記事を書いた人

情シスの自由帳管理人のアバター 情シスの自由帳管理人 情シスの自由帳管理人

社内SE歴15年以上。現在も社内のPC管理・ネットワーク・サーバー運用から、日常的なトラブル対応、プログラム開発まで幅広く従事しています。
「情シスの自由帳」では、パソコンが苦手な方や新人の社内SEの方、テレワーク中に困りごとがある方に向けて、実務経験に基づいた再現性の高い解説を心がけています。

【基本検証環境】
Windows 11 Home(64bit)/Intel(R) Core(TM) Ultra 7 155H(1.40GHz)/32GB RAM

コメント

コメントする

目次