Security: Understand security issues | Chrome DevTools

<!doctype html> <html lang="en" dir="ltr"> <head> <meta name="google-signin-client-id" content="157101835696-ooapojlodmuabs2do2vuhhnf90bccmoi.apps.googleusercontent.com"> <meta name="google-signin-scope" content="profile email https://www.googleapis.com/auth/developerprofiles https://www.googleapis.com/auth/developerprofiles.award"> <meta property="og:site_name" content="Chrome for Developers"> <meta property="og:type" content="website"><meta name="theme-color" content="#1a73e8"><meta charset="utf-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="manifest" href="/_pwa/chrome/manifest.json" crossorigin="use-credentials"> <link rel="preconnect" href="//www.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.gstatic.com" crossorigin> <link rel="preconnect" href="//fonts.googleapis.com" crossorigin> <link rel="preconnect" href="//apis.google.com" crossorigin> <link rel="preconnect" href="//www.google-analytics.com" crossorigin><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"> <link rel="stylesheet" href="//fonts.googleapis.com/css2?family=Material+Icons&family=Material+Symbols+Outlined&display=block"><link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/css/app.css"> <link rel="stylesheet" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/css/dark-theme.css" disabled> <link rel="shortcut icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/favicon.png"> <link rel="apple-touch-icon" href="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/touchicon-180.png"><link rel="canonical" href="https://developer.chrome.com/docs/devtools/security"><link rel="search" type="application/opensearchdescription+xml" title="Chrome for Developers" href="https://developer.chrome.com/s/opensearch.xml"> <link rel="alternate" hreflang="en" href="https://developer.chrome.com/docs/devtools/security" /><link rel="alternate" hreflang="x-default" href="https://developer.chrome.com/docs/devtools/security" /><link rel="alternate" hreflang="ar" href="https://developer.chrome.com/docs/devtools/security?hl=ar" /><link rel="alternate" hreflang="bn" href="https://developer.chrome.com/docs/devtools/security?hl=bn" /><link rel="alternate" hreflang="zh-Hans" href="https://developer.chrome.com/docs/devtools/security?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant" href="https://developer.chrome.com/docs/devtools/security?hl=zh-tw" /><link rel="alternate" hreflang="nl" href="https://developer.chrome.com/docs/devtools/security?hl=nl" /><link rel="alternate" hreflang="fa" href="https://developer.chrome.com/docs/devtools/security?hl=fa" /><link rel="alternate" hreflang="fr" href="https://developer.chrome.com/docs/devtools/security?hl=fr" /><link rel="alternate" hreflang="de" href="https://developer.chrome.com/docs/devtools/security?hl=de" /><link rel="alternate" hreflang="he" href="https://developer.chrome.com/docs/devtools/security?hl=he" /><link rel="alternate" hreflang="hi" href="https://developer.chrome.com/docs/devtools/security?hl=hi" /><link rel="alternate" hreflang="id" href="https://developer.chrome.com/docs/devtools/security?hl=id" /><link rel="alternate" hreflang="it" href="https://developer.chrome.com/docs/devtools/security?hl=it" /><link rel="alternate" hreflang="ja" href="https://developer.chrome.com/docs/devtools/security?hl=ja" /><link rel="alternate" hreflang="ko" href="https://developer.chrome.com/docs/devtools/security?hl=ko" /><link rel="alternate" hreflang="pl" href="https://developer.chrome.com/docs/devtools/security?hl=pl" /><link rel="alternate" hreflang="pt-BR" href="https://developer.chrome.com/docs/devtools/security?hl=pt-br" /><link rel="alternate" hreflang="ru" href="https://developer.chrome.com/docs/devtools/security?hl=ru" /><link rel="alternate" hreflang="es-419" href="https://developer.chrome.com/docs/devtools/security?hl=es-419" /><link rel="alternate" hreflang="th" href="https://developer.chrome.com/docs/devtools/security?hl=th" /><link rel="alternate" hreflang="tr" href="https://developer.chrome.com/docs/devtools/security?hl=tr" /><link rel="alternate" hreflang="vi" href="https://developer.chrome.com/docs/devtools/security?hl=vi" /><link rel="alternate" hreflang="en-cn" href="https://developer.chrome.google.cn/docs/devtools/security" /><link rel="alternate" hreflang="x-default" href="https://developer.chrome.google.cn/docs/devtools/security" /><link rel="alternate" hreflang="ar-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=ar" /><link rel="alternate" hreflang="bn-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=bn" /><link rel="alternate" hreflang="zh-Hans-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=zh-cn" /><link rel="alternate" hreflang="zh-Hant-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=zh-tw" /><link rel="alternate" hreflang="nl-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=nl" /><link rel="alternate" hreflang="fa-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=fa" /><link rel="alternate" hreflang="fr-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=fr" /><link rel="alternate" hreflang="de-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=de" /><link rel="alternate" hreflang="he-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=he" /><link rel="alternate" hreflang="hi-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=hi" /><link rel="alternate" hreflang="id-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=id" /><link rel="alternate" hreflang="it-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=it" /><link rel="alternate" hreflang="ja-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=ja" /><link rel="alternate" hreflang="ko-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=ko" /><link rel="alternate" hreflang="pl-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=pl" /><link rel="alternate" hreflang="pt-BR-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=pt-br" /><link rel="alternate" hreflang="ru-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=ru" /><link rel="alternate" hreflang="es-419-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=es-419" /><link rel="alternate" hreflang="th-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=th" /><link rel="alternate" hreflang="tr-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=tr" /><link rel="alternate" hreflang="vi-cn" href="https://developer.chrome.google.cn/docs/devtools/security?hl=vi" /><title>Security: Understand security issues  |  Chrome DevTools  |  Chrome for Developers</title> <meta property="og:title" content="Security: Understand security issues  |  Chrome DevTools  |  Chrome for Developers"><meta name="description" content="Use the Security panel to make sure that a page is fully protected by HTTPS."> <meta property="og:description" content="Use the Security panel to make sure that a page is fully protected by HTTPS."><meta property="og:url" content="https://developer.chrome.com/docs/devtools/security"><meta property="og:locale" content="en"><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Article", "dateModified": "2024-09-27", "headline": "Security: Understand security issues" } </script><script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Docs", "item": "https://developer.chrome.com/docs" },{ "@type": "ListItem", "position": 2, "name": "Chrome DevTools", "item": "https://developer.chrome.com/docs/devtools" },{ "@type": "ListItem", "position": 3, "name": "Security: Understand security issues", "item": "https://developer.chrome.com/docs/devtools/security" }] } </script> <link rel="stylesheet" href="/extras.css"></head> <body class="" template="page" theme="chrome-theme" type="article" appearance layout="docs" display-toc pending> <devsite-progress type="indeterminate" id="app-progress"></devsite-progress> <section class="devsite-wrapper"> <devsite-cookie-notification-bar></devsite-cookie-notification-bar><devsite-header role="banner"> <div class="devsite-header--inner nocontent"> <div class="devsite-top-logo-row-wrapper-wrapper"> <div class="devsite-top-logo-row-wrapper"> <div class="devsite-top-logo-row"> <button type="button" id="devsite-hamburger-menu" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Navigation menu button" visually-hidden aria-label="Open menu"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="chromeForDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Chrome for Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg" class="devsite-site-logo" alt="Chrome for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> <div class="devsite-top-logo-row-middle"> <div class="devsite-header-upper-tabs"> <devsite-tabs class="upper-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Upper tabs"> <tab > <a href="https://developer.chrome.com/case-studies" track-metadata-eventdetail="https://developer.chrome.com/case-studies" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - get inspired" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Get inspired" track-name="get inspired" > Get inspired </a> </tab> <tab > <a href="https://developer.chrome.com/blog" track-metadata-eventdetail="https://developer.chrome.com/blog" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - blog" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Blog" track-name="blog" > Blog </a> </tab> <tab class="devsite-dropdown devsite-dropdown-full devsite-active "> <a href="https://developer.chrome.com/docs" track-metadata-eventdetail="https://developer.chrome.com/docs" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - docs" track-metadata-module="primary nav" aria-label="Docs, selected" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" > Docs </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Docs" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs" track-metadata-position="nav - docs" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section build-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Build with Chrome</li> <li class="devsite-nav-description">Learn how Chrome works, participate in origin trials, and build with Chrome everywhere. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/web-platform" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/web-platform" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Web Platform </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/capabilities" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/capabilities" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Capabilities </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/chromedriver" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/chromedriver" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> ChromeDriver </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/extensions" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/extensions" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Extensions </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/webstore" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/webstore" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Chrome Web Store </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/chromium" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/chromium" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Chromium </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/aurora" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/aurora" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Aurora </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/android" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/android" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Web on Android </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/origintrials/" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/origintrials/" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Origin trials </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/release-notes" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/release-notes" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="build with chrome" tooltip > <div class="devsite-nav-item-title"> Release notes </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section productivity-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Productivity</li> <li class="devsite-nav-description">Create the best experience for your users with the web's best tools.</li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> DevTools </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/lighthouse" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/lighthouse" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Lighthouse </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/crux" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/crux" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Chrome UX Report </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/accessibility" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/accessibility" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Accessibility </div> </a> </li> </ul> <ul class="devsite-tabs-dropdown-section dcc-subnav second-column-list"> <li class="devsite-nav-description">Get things done quicker and neater, with our ready-made libraries. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/workbox" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/workbox" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Workbox </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/puppeteer" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/puppeteer" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="productivity" tooltip > <div class="devsite-nav-item-title"> Puppeteer </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section experience-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Experience</li> <li class="devsite-nav-description">Design a beautiful and performant web with Chrome. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/ai" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/ai" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> AI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/performance" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/performance" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Performance </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/css-ui" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/css-ui" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> CSS and UI </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/identity" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/identity" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Identity </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/payments" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/payments" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Payments </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/privacy-security" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/privacy-security" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="experience" tooltip > <div class="devsite-nav-item-title"> Privacy and security </div> </a> </li> </ul> </div> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section resources-icon dcc-subnav"> <li class="devsite-nav-title" role="heading" tooltip>Resources</li> <li class="devsite-nav-description">More from the Chrome team. </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> All documentation </div> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev/baseline" track-type="nav" track-metadata-eventdetail="https://web.dev/baseline" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> Baseline </div> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev" track-type="nav" track-metadata-eventdetail="https://web.dev" track-metadata-position="nav - docs" track-metadata-module="tertiary nav" track-metadata-module_headline="resources" tooltip > <div class="devsite-nav-item-title"> web.dev </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://developer.chrome.com/new" track-metadata-eventdetail="https://developer.chrome.com/new" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - new in chrome" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: New in Chrome" track-name="new in chrome" > New in Chrome </a> </tab> </nav> </devsite-tabs> </div> <devsite-search enable-signin enable-search enable-suggestions enable-query-completion project-name="Chrome DevTools" tenant-name="Chrome for Developers" > <form class="devsite-search-form" action="https://developer.chrome.com/s/results" method="GET"> <div class="devsite-search-container"> <button type="button" search-open class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Open search"></button> <div class="devsite-searchbox"> <input aria-activedescendant="" aria-autocomplete="list" aria-label="Search" aria-expanded="false" aria-haspopup="listbox" autocomplete="off" class="devsite-search-field devsite-search-query" name="q" placeholder="Search" role="combobox" type="text" value="" > <div class="devsite-search-image material-icons" aria-hidden="true"> </div> <div class="devsite-search-shortcut-icon-container" aria-hidden="true"> <kbd class="devsite-search-shortcut-icon">/</kbd> </div> </div> </div> </form> <button type="button" search-close class="devsite-search-button devsite-header-icon-button button-flat material-icons" aria-label="Close search"></button> </devsite-search> </div> <devsite-appearance-selector></devsite-appearance-selector> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="nl" >Nederlands</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> <devsite-user enable-profiles id="devsite-user"> <span class="button devsite-top-button" aria-hidden="true" visually-hidden>Sign in</span> </devsite-user> </div> </div> </div> <div class="devsite-collapsible-section "> <div class="devsite-header-background"> <div class="devsite-product-id-row" > <div class="devsite-product-description-row"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> <a href="https://developer.chrome.com/docs/devtools" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Lower Header" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="Chrome DevTools" > Chrome DevTools </a> </li> </ul> </div> </div> <div class="devsite-doc-set-nav-row"> <devsite-tabs class="lower-tabs"> <nav class="devsite-tabs-wrapper" aria-label="Lower tabs"> <tab > <a href="https://developer.chrome.com/docs/devtools" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - devtools" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: DevTools" track-name="devtools" > DevTools </a> </tab> <tab > <a href="https://developer.chrome.com/docs/devtools/ai-assistance/quickstart" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/ai-assistance/quickstart" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - ai assistance" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: AI assistance" track-name="ai assistance" > AI assistance </a> </tab> <tab class="devsite-dropdown "> <a href="https://developer.chrome.com/docs/devtools/dom" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/dom" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - panels" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Panels" track-name="panels" > Panels </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for Panels" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/dom" track-metadata-position="nav - panels" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Panels" track-name="panels" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/elements" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/elements" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Elements </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/console" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/console" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Console </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/sources" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/sources" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Sources </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/network/overview" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/network/overview" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Network </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/performance/overview" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/performance/overview" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Performance </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/memory" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/memory" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Memory </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/application" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/application" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Application </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/recorder/overview" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/recorder/overview" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Recorder </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/rendering" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/rendering" track-metadata-position="nav - panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Rendering </div> </a> </li> </ul> </div> </div> </div> </tab> <tab class="devsite-dropdown devsite-active "> <a href="https://developer.chrome.com/docs/devtools/security" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/security" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - more panels" track-metadata-module="primary nav" aria-label="More panels, selected" data-category="Site-Wide Custom Events" data-label="Tab: More panels" track-name="more panels" > More panels </a> <a href="#" role="button" aria-haspopup="true" aria-expanded="false" aria-label="Dropdown menu for More panels" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/security" track-metadata-position="nav - more panels" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: More panels" track-name="more panels" class="devsite-tabs-dropdown-toggle devsite-icon devsite-icon-arrow-drop-down"></a> <div class="devsite-tabs-dropdown" aria-label="submenu" hidden> <div class="devsite-tabs-dropdown-content"> <div class="devsite-tabs-dropdown-column "> <ul class="devsite-tabs-dropdown-section "> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/autofill" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/autofill" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Autofill </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/css/animations" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/css/animations" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Animations </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/changes" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/changes" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Changes </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/coverage" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/coverage" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Coverage </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/developer-resources" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/developer-resources" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Developer resources </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/css-overview" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/css-overview" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> CSS overview </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/issues" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/issues" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Issues </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/layers" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/layers" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Layers </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/lighthouse" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/lighthouse" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Lighthouse </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/media-panel" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/media-panel" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Media </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/memory-inspector" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/memory-inspector" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Memory Inspector </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/device-mode/override-user-agent" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/device-mode/override-user-agent" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Network conditions </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/network-request-blocking" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/network-request-blocking" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Network request blocking </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/performance-monitor" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/performance-monitor" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Performance monitor </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/protocol-monitor" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/protocol-monitor" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Protocol monitor </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/quick-source" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/quick-source" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Quick source </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/security" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/security" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Security </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/sensors" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/sensors" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> Sensors </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/webaudio" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/webaudio" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> WebAudio </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/webauthn" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/webauthn" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> WebAuthn </div> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/docs/devtools/whats-new" track-type="nav" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/whats-new" track-metadata-position="nav - more panels" track-metadata-module="tertiary nav" tooltip > <div class="devsite-nav-item-title"> What's new </div> </a> </li> </ul> </div> </div> </div> </tab> <tab > <a href="https://developer.chrome.com/docs/devtools/settings" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/settings" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - settings" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Settings" track-name="settings" > Settings </a> </tab> <tab > <a href="https://developer.chrome.com/docs/devtools/accessibility/reference" track-metadata-eventdetail="https://developer.chrome.com/docs/devtools/accessibility/reference" class="devsite-tabs-content gc-analytics-event " track-type="nav" track-metadata-position="nav - accessibility" track-metadata-module="primary nav" data-category="Site-Wide Custom Events" data-label="Tab: Accessibility" track-name="accessibility" > Accessibility </a> </tab> </nav> </devsite-tabs> </div> </div> </div> </div> </devsite-header> <devsite-book-nav scrollbars > <div class="devsite-book-nav-filter" > <span class="filter-list-icon material-icons" aria-hidden="true"></span> <input type="text" placeholder="Filter" aria-label="Type to filter" role="searchbox"> <span class="filter-clear-button hidden" data-title="Clear filter" aria-label="Clear filter" role="button" tabindex="0"></span> </div> <nav class="devsite-book-nav devsite-nav nocontent" aria-label="Side menu"> <div class="devsite-mobile-header"> <button type="button" id="devsite-close-nav" class="devsite-header-icon-button button-flat material-icons gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Close navigation" aria-label="Close navigation"> </button> <div class="devsite-product-name-wrapper"> <a href="/" class="devsite-site-logo-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Site logo" track-type="globalNav" track-name="chromeForDevelopers" track-metadata-position="nav" track-metadata-eventDetail="nav"> <picture> <source srcset="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup-dark-theme.svg" media="(prefers-color-scheme: dark)" class="devsite-dark-theme" alt="Chrome for Developers"> <img src="https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg" class="devsite-site-logo" alt="Chrome for Developers"> </picture> </a> <span class="devsite-product-name"> <ul class="devsite-breadcrumb-list" > <li class="devsite-breadcrumb-item "> </li> </ul> </span> </div> </div> <div class="devsite-book-nav-wrapper"> <div class="devsite-mobile-nav-top"> <ul class="devsite-nav-list"> <li class="devsite-nav-item"> <a href="/case-studies" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Get inspired" track-name="get inspired" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Get inspired" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Get inspired </span> </a> </li> <li class="devsite-nav-item"> <a href="/blog" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Blog" track-name="blog" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Blog" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Blog </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs" class="devsite-nav-title gc-analytics-event devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Docs" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Docs </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu "> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Docs" track-name="docs" > <span class="devsite-nav-text" tooltip menu="Docs"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Docs"> </span> </span> </li> </ul> <ul class="devsite-nav-responsive-tabs"> <li class="devsite-nav-item"> <a href="/docs/devtools" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: DevTools" track-name="devtools" data-category="Site-Wide Custom Events" data-label="Responsive Tab: DevTools" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > DevTools </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/ai-assistance/quickstart" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: AI assistance" track-name="ai assistance" data-category="Site-Wide Custom Events" data-label="Responsive Tab: AI assistance" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > AI assistance </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/dom" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: Panels" track-name="panels" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Panels" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Panels </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu devsite-lower-tab-item"> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: Panels" track-name="panels" > <span class="devsite-nav-text" tooltip menu="Panels"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="Panels"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/security" class="devsite-nav-title gc-analytics-event devsite-nav-has-children devsite-nav-active" data-category="Site-Wide Custom Events" data-label="Tab: More panels" track-name="more panels" data-category="Site-Wide Custom Events" data-label="Responsive Tab: More panels" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip menu="_book"> More panels </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="_book"> </span> </a> <ul class="devsite-nav-responsive-tabs devsite-nav-has-menu devsite-lower-tab-item"> <li class="devsite-nav-item"> <span class="devsite-nav-title" tooltip data-category="Site-Wide Custom Events" data-label="Tab: More panels" track-name="more panels" > <span class="devsite-nav-text" tooltip menu="More panels"> More </span> <span class="devsite-nav-icon material-icons" data-icon="forward" menu="More panels"> </span> </span> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/settings" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Settings" track-name="settings" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Settings" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Settings </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/accessibility/reference" class="devsite-nav-title gc-analytics-event devsite-nav-has-children " data-category="Site-Wide Custom Events" data-label="Tab: Accessibility" track-name="accessibility" data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessibility" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessibility </span> <span class="devsite-nav-icon material-icons" data-icon="forward" > </span> </a> </li> </ul> </li> <li class="devsite-nav-item"> <a href="/new" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Tab: New in Chrome" track-name="new in chrome" data-category="Site-Wide Custom Events" data-label="Responsive Tab: New in Chrome" track-type="globalNav" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > New in Chrome </span> </a> </li> </ul> </div> <div class="devsite-mobile-nav-bottom"> <ul class="devsite-nav-list" menu="_book"> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Get started</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/open" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/open" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/open" ><span class="devsite-nav-text" tooltip>Open Chrome DevTools</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/news" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/news" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/news" ><span class="devsite-nav-text" tooltip>What's new in DevTools</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/customize" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/customize" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/customize" ><span class="devsite-nav-text" tooltip>Customize DevTools</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/tips" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/tips" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/tips" ><span class="devsite-nav-text" tooltip>DevTools Tips</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Commands and shortcuts</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/command-menu" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/command-menu" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/command-menu" ><span class="devsite-nav-text" tooltip>Run commands in the Command Menu</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/disable" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/disable" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/disable" ><span class="devsite-nav-text" tooltip>Disable JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/shortcuts" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/shortcuts" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/shortcuts" ><span class="devsite-nav-text" tooltip>Keyboard shortcuts</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/device-mode" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/device-mode" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/device-mode" ><span class="devsite-nav-text" tooltip>Simulate mobile devices with Device Mode</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/search" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/search" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/search" ><span class="devsite-nav-text" tooltip>Find text across all loaded resources with Search</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Elements</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/elements" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/elements" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/elements" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>DOM</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/devtools/dom" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/dom" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/dom" ><span class="devsite-nav-text" tooltip>View and change the DOM</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/dom/properties" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/dom/properties" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/dom/properties" ><span class="devsite-nav-text" tooltip>View properties of DOM objects</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/elements/badges" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/elements/badges" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/elements/badges" ><span class="devsite-nav-text" tooltip>Badges references</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>CSS</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/devtools/css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css" ><span class="devsite-nav-text" tooltip>View and change CSS</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/issues" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/issues" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/issues" ><span class="devsite-nav-text" tooltip>Find invalid, overridden, inactive, and other CSS</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/color" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/color" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/color" ><span class="devsite-nav-text" tooltip>Inspect and debug with the Color Picker</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/grid" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/grid" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/grid" ><span class="devsite-nav-text" tooltip>Inspect grid layouts</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/flexbox" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/flexbox" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/flexbox" ><span class="devsite-nav-text" tooltip>Inspect and debug flexbox layouts</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/container-queries" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/container-queries" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/container-queries" ><span class="devsite-nav-text" tooltip>Inspect and debug container queries</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/css/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/reference" ><span class="devsite-nav-text" tooltip>Feature reference</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>AI assistance</span> </div></li> <li class="devsite-nav-item devsite-nav-experimental"><a href="/docs/devtools/ai-assistance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance" ><span class="devsite-nav-text" tooltip>Overview</span><span class="devsite-nav-icon material-icons" data-icon="experimental" data-title="Experimental!" aria-hidden="true"></span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/ai-assistance/quickstart" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance/quickstart" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance/quickstart" ><span class="devsite-nav-text" tooltip>Quickstart</span></a></li> <li class="devsite-nav-item devsite-nav-expandable devsite-nav-experimental"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>Topics</span><span class="devsite-nav-icon material-icons" data-icon="experimental" data-title="Experimental!" aria-hidden="true"></span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/devtools/ai-assistance/styling" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance/styling" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance/styling" ><span class="devsite-nav-text" tooltip>Styling</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/ai-assistance/network" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance/network" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance/network" ><span class="devsite-nav-text" tooltip>Network</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/ai-assistance/sources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance/sources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance/sources" ><span class="devsite-nav-text" tooltip>Sources</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/ai-assistance/performance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/ai-assistance/performance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/ai-assistance/performance" ><span class="devsite-nav-text" tooltip>Performance</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Console</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/console" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/understand-messages" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/understand-messages" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/understand-messages" ><span class="devsite-nav-text" tooltip>Understand errors and warnings with Console insights</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/log" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/log" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/log" ><span class="devsite-nav-text" tooltip>Log messages</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/javascript" ><span class="devsite-nav-text" tooltip>Run JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/live-expressions" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/live-expressions" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/live-expressions" ><span class="devsite-nav-text" tooltip>Watch JavaScript in real-time</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/format-style" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/format-style" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/format-style" ><span class="devsite-nav-text" tooltip>Format and style messages</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/reference" ><span class="devsite-nav-text" tooltip>Feature reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/api" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/api" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/api" ><span class="devsite-nav-text" tooltip>API reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/console/utilities" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/console/utilities" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/console/utilities" ><span class="devsite-nav-text" tooltip>Utilities API reference</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Sources</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/sources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/sources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/sources" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript" ><span class="devsite-nav-text" tooltip>Debug JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/breakpoints" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/breakpoints" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/breakpoints" ><span class="devsite-nav-text" tooltip>Pause your code with breakpoints</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/snippets" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/snippets" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/snippets" ><span class="devsite-nav-text" tooltip>Run snippets of JavaScript</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/source-maps" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/source-maps" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/source-maps" ><span class="devsite-nav-text" tooltip>Debug original code instead of deployed with source maps</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/workspaces" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/workspaces" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/workspaces" ><span class="devsite-nav-text" tooltip>Edit and save files in a workspace</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/overrides" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/overrides" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/overrides" ><span class="devsite-nav-text" tooltip>Override web content and HTTP response headers locally</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/reference" ><span class="devsite-nav-text" tooltip>JavaScript debugging reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/wasm" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/wasm" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/wasm" ><span class="devsite-nav-text" tooltip>Debug C/C++ WebAssembly</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Network</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/network/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/network/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/network/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/network" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/network" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/network" ><span class="devsite-nav-text" tooltip>Inspect network activity</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/network/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/network/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/network/reference" ><span class="devsite-nav-text" tooltip>Features reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/resources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/resources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/resources" ><span class="devsite-nav-text" tooltip>View page resources</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Performance</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance" ><span class="devsite-nav-text" tooltip>Analyze runtime performance</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/reference" ><span class="devsite-nav-text" tooltip>Features reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/timeline-reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/timeline-reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/timeline-reference" ><span class="devsite-nav-text" tooltip>Timeline event reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/selector-stats" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/selector-stats" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/selector-stats" ><span class="devsite-nav-text" tooltip>Analyze CSS selector performance</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/nodejs" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/nodejs" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/nodejs" ><span class="devsite-nav-text" tooltip>Profile Node.js performance</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance/extension" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance/extension" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance/extension" ><span class="devsite-nav-text" tooltip>Customize your performance data with extensibility API</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance-insights" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance-insights" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance-insights" ><span class="devsite-nav-text" tooltip>Get actionable insights on your website's performance</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Lighthouse</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/lighthouse" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/lighthouse" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/lighthouse" ><span class="devsite-nav-text" tooltip>Optimize web speed</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Memory</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory-problems/memory-101" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory-problems/memory-101" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory-problems/memory-101" ><span class="devsite-nav-text" tooltip>Memory terminology</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory-problems" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory-problems" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory-problems" ><span class="devsite-nav-text" tooltip>Fix memory problems</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory-problems/heap-snapshots" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory-problems/heap-snapshots" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory-problems/heap-snapshots" ><span class="devsite-nav-text" tooltip>Record heap snapshots</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory-problems/allocation-profiler" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory-problems/allocation-profiler" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory-problems/allocation-profiler" ><span class="devsite-nav-text" tooltip>Allocation Profiler tool</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Application</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/application" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/application" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/application" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/progressive-web-apps" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/progressive-web-apps" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/progressive-web-apps" ><span class="devsite-nav-text" tooltip>Debug Progressive Web Apps</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>View and edit</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/devtools/storage/localstorage" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/localstorage" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/localstorage" ><span class="devsite-nav-text" tooltip>Local storage</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/storage/sessionstorage" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/sessionstorage" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/sessionstorage" ><span class="devsite-nav-text" tooltip>Session storage</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/storage/indexeddb" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/indexeddb" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/indexeddb" ><span class="devsite-nav-text" tooltip>IndexedDB data</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/storage/websql" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/websql" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/websql" ><span class="devsite-nav-text" tooltip>Web SQL data</span></a></li></ul></div></li> <li class="devsite-nav-item"><a href="/docs/devtools/application/cookies" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/application/cookies" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/application/cookies" ><span class="devsite-nav-text" tooltip>View, add, edit, and delete cookies</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/storage/cache" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/cache" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/cache" ><span class="devsite-nav-text" tooltip>View cache data</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/application/back-forward-cache" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/application/back-forward-cache" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/application/back-forward-cache" ><span class="devsite-nav-text" tooltip>Test back/forward caching</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/application/debugging-speculation-rules" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/application/debugging-speculation-rules" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/application/debugging-speculation-rules" ><span class="devsite-nav-text" tooltip>Debugging speculation rules</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/javascript/background-services" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/javascript/background-services" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/javascript/background-services" ><span class="devsite-nav-text" tooltip>Debug background services</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/application/frames" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/application/frames" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/application/frames" ><span class="devsite-nav-text" tooltip>View frame details</span></a></li> <li class="devsite-nav-item devsite-nav-deprecated"><a href="/docs/devtools/storage/applicationcache" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/storage/applicationcache" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/storage/applicationcache" ><span class="devsite-nav-text" tooltip>View Application Cache data</span><span class="devsite-nav-icon material-icons" data-icon="deprecated" data-title="Deprecated" aria-hidden="true"></span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Recorder</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/recorder/overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/recorder/overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/recorder/overview" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/recorder" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/recorder" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/recorder" ><span class="devsite-nav-text" tooltip>Record, replay, and measure user flows</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/recorder/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/recorder/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/recorder/reference" ><span class="devsite-nav-text" tooltip>Features reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/recorder/extensions" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/recorder/extensions" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/recorder/extensions" ><span class="devsite-nav-text" tooltip>Customize the Recorder with extensions</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Rendering</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/rendering" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/rendering" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/rendering" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/rendering/performance" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/rendering/performance" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/rendering/performance" ><span class="devsite-nav-text" tooltip>Discover issues with rendering performance</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/rendering/emulate-css" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/rendering/emulate-css" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/rendering/emulate-css" ><span class="devsite-nav-text" tooltip>Emulate CSS media features</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/rendering/apply-effects" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/rendering/apply-effects" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/rendering/apply-effects" ><span class="devsite-nav-text" tooltip>Apply rendering effects</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>More panels</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/autofill" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/autofill" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/autofill" ><span class="devsite-nav-text" tooltip>Inspect and debug saved addresses with the Autofill panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/security" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/security" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/security" ><span class="devsite-nav-text" tooltip>Understand security issues with the Security panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/sensors" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/sensors" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/sensors" ><span class="devsite-nav-text" tooltip>Emulate device sensors with the Sensors panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/webaudio" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/webaudio" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/webaudio" ><span class="devsite-nav-text" tooltip>View WebAudio API metrics with the WebAudio panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/webauthn" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/webauthn" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/webauthn" ><span class="devsite-nav-text" tooltip>Emulate authenticators with the WebAuthn panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/css/animations" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css/animations" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css/animations" ><span class="devsite-nav-text" tooltip>Inspect and modify animations with the Animations panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/changes" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/changes" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/changes" ><span class="devsite-nav-text" tooltip>Track changes to HTML, CSS, and JavaScript with the Changes panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/coverage" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/coverage" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/coverage" ><span class="devsite-nav-text" tooltip>Find and analyze unused code with the Coverage panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/developer-resources" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/developer-resources" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/developer-resources" ><span class="devsite-nav-text" tooltip>View and manually load source maps with the Developer Resources panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/css-overview" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/css-overview" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/css-overview" ><span class="devsite-nav-text" tooltip>Identify potential CSS improvements with the CSS Overview panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/issues" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/issues" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/issues" ><span class="devsite-nav-text" tooltip>Find and fix problems with the Issues panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/layers" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/layers" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/layers" ><span class="devsite-nav-text" tooltip>Analyze the layers of your website with the Layers panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/media-panel" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/media-panel" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/media-panel" ><span class="devsite-nav-text" tooltip>Debug media players with the Media panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/memory-inspector" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/memory-inspector" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/memory-inspector" ><span class="devsite-nav-text" tooltip>Inspect ArrayBuffer, TypedArray, DataView or Wasm memory with the Memory inspector panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/device-mode/override-user-agent" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/device-mode/override-user-agent" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/device-mode/override-user-agent" ><span class="devsite-nav-text" tooltip>Override the user agent string with the Network conditions panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/network-request-blocking" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/network-request-blocking" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/network-request-blocking" ><span class="devsite-nav-text" tooltip>Selectively block resources with the Network request blocking panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/performance-monitor" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/performance-monitor" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/performance-monitor" ><span class="devsite-nav-text" tooltip>Analyze runtime performance in real-time with the Performance monitor panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/protocol-monitor" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/protocol-monitor" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/protocol-monitor" ><span class="devsite-nav-text" tooltip>View and send CDP requests with the Protocol monitor panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/quick-source" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/quick-source" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/quick-source" ><span class="devsite-nav-text" tooltip>View source files while having access to other tools with the Quick source panel</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/whats-new" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/whats-new" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/whats-new" ><span class="devsite-nav-text" tooltip>What's new</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Remote debugging</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/remote-debugging" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/remote-debugging" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/remote-debugging" ><span class="devsite-nav-text" tooltip>Remote debug Android devices</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/remote-debugging/local-server" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/remote-debugging/local-server" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/remote-debugging/local-server" ><span class="devsite-nav-text" tooltip>Access local servers and Chrome instances with port forwarding</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/remote-debugging/webviews" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/remote-debugging/webviews" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/remote-debugging/webviews" ><span class="devsite-nav-text" tooltip>Remote debugging WebViews</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Accessibility</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/accessibility/reference" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/accessibility/reference" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/accessibility/reference" ><span class="devsite-nav-text" tooltip>Features reference</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/accessibility/contrast" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/accessibility/contrast" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/accessibility/contrast" ><span class="devsite-nav-text" tooltip>Contrast and readability</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/accessibility/focus" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/accessibility/focus" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/accessibility/focus" ><span class="devsite-nav-text" tooltip>Track elements focus</span></a></li> <li class="devsite-nav-item"><a href="/docs/devtools/accessibility/navigation" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/accessibility/navigation" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/accessibility/navigation" ><span class="devsite-nav-text" tooltip>Navigate DevTools with assistive technology</span></a></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Settings</span> </div></li> <li class="devsite-nav-item"><a href="/docs/devtools/settings" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings" ><span class="devsite-nav-text" tooltip>Overview</span></a></li> <li class="devsite-nav-item devsite-nav-expandable"><div class="devsite-expandable-nav"> <a class="devsite-nav-toggle" aria-hidden="true"></a><div class="devsite-nav-title devsite-nav-title-no-path" tabindex="0" role="button"> <span class="devsite-nav-text" tooltip>All settings</span> </div><ul class="devsite-nav-section"><li class="devsite-nav-item"><a href="/docs/devtools/settings/preferences" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/preferences" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/preferences" ><span class="devsite-nav-text" tooltip>Preferences</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/workspace" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/workspace" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/workspace" ><span class="devsite-nav-text" tooltip>Workspace</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/ai-innovations" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/ai-innovations" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/ai-innovations" ><span class="devsite-nav-text" tooltip>AI innovations</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/experiments" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/experiments" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/experiments" ><span class="devsite-nav-text" tooltip>Experiments</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/ignore-list" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/ignore-list" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/ignore-list" ><span class="devsite-nav-text" tooltip>Ignore list</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/devices" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/devices" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/devices" ><span class="devsite-nav-text" tooltip>Devices</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/throttling" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/throttling" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/throttling" ><span class="devsite-nav-text" tooltip>Throttling</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/locations" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/locations" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/locations" ><span class="devsite-nav-text" tooltip>Locations</span></a></li><li class="devsite-nav-item"><a href="/docs/devtools/settings/shortcuts" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /docs/devtools/settings/shortcuts" track-type="bookNav" track-name="click" track-metadata-eventdetail="/docs/devtools/settings/shortcuts" ><span class="devsite-nav-text" tooltip>Shortcuts</span></a></li></ul></div></li> <li class="devsite-nav-item devsite-nav-heading"><div class="devsite-nav-title devsite-nav-title-no-path"> <span class="devsite-nav-text" tooltip>Resources</span> </div></li> <li class="devsite-nav-item"><a href="/discover?category=engineeringblog" class="devsite-nav-title gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Book nav link, pathname: /discover?category=engineeringblog" track-type="bookNav" track-name="click" track-metadata-eventdetail="/discover?category=engineeringblog" ><span class="devsite-nav-text" tooltip>Engineering blog</span></a></li> </ul> <ul class="devsite-nav-list" menu="Docs" aria-label="Side menu" hidden> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Build with Chrome </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/web-platform" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web Platform" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web Platform </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/capabilities" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Capabilities" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Capabilities </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/chromedriver" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: ChromeDriver" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > ChromeDriver </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/extensions" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Extensions" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Extensions </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/webstore" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chrome Web Store" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chrome Web Store </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/chromium" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chromium" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chromium </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/aurora" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Aurora" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Aurora </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/android" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Web on Android" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Web on Android </span> </a> </li> <li class="devsite-nav-item"> <a href="https://developer.chrome.com/origintrials/" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Origin trials" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Origin trials </span> </a> </li> <li class="devsite-nav-item"> <a href="/release-notes" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Release notes" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Release notes </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Productivity </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/devtools" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: DevTools" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > DevTools </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/lighthouse" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Lighthouse" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Lighthouse </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/crux" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Chrome UX Report" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Chrome UX Report </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/accessibility" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Accessibility" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Accessibility </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/workbox" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Workbox" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Workbox </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/puppeteer" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Puppeteer" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Puppeteer </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Experience </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs/ai" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: AI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > AI </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/performance" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/css-ui" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: CSS and UI" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > CSS and UI </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/identity" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Identity" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Identity </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/payments" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Payments" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Payments </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/privacy-security" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Privacy and security" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Privacy and security </span> </a> </li> <li class="devsite-nav-item devsite-nav-heading"> <span class="devsite-nav-title" tooltip > <span class="devsite-nav-text" tooltip > Resources </span> </span> </li> <li class="devsite-nav-item"> <a href="/docs" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: All documentation" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > All documentation </span> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev/baseline" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Baseline" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Baseline </span> </a> </li> <li class="devsite-nav-item"> <a href="https://web.dev" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: web.dev" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > web.dev </span> </a> </li> </ul> <ul class="devsite-nav-list" menu="Panels" aria-label="Side menu" hidden> <li class="devsite-nav-item"> <a href="/docs/devtools/elements" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Elements" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Elements </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/console" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Console" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Console </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/sources" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Sources" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Sources </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/network/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Network" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Network </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/performance/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/memory" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Memory" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Memory </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/application" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Application" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Application </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/recorder/overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Recorder" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Recorder </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/rendering" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Rendering" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Rendering </span> </a> </li> </ul> <ul class="devsite-nav-list" menu="More panels" aria-label="Side menu" hidden> <li class="devsite-nav-item"> <a href="/docs/devtools/autofill" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Autofill" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Autofill </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/css/animations" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Animations" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Animations </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/changes" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Changes" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Changes </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/coverage" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Coverage" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Coverage </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/developer-resources" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Developer resources" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Developer resources </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/css-overview" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: CSS overview" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > CSS overview </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/issues" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Issues" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Issues </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/layers" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Layers" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Layers </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/lighthouse" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Lighthouse" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Lighthouse </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/media-panel" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Media" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Media </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/memory-inspector" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Memory Inspector" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Memory Inspector </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/device-mode/override-user-agent" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Network conditions" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Network conditions </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/network-request-blocking" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Network request blocking" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Network request blocking </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/performance-monitor" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Performance monitor" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Performance monitor </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/protocol-monitor" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Protocol monitor" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Protocol monitor </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/quick-source" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Quick source" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Quick source </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/security" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Security" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Security </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/sensors" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: Sensors" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > Sensors </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/webaudio" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: WebAudio" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > WebAudio </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/webauthn" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: WebAuthn" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > WebAuthn </span> </a> </li> <li class="devsite-nav-item"> <a href="/docs/devtools/whats-new" class="devsite-nav-title gc-analytics-event " data-category="Site-Wide Custom Events" data-label="Responsive Tab: What's new" track-type="navMenu" track-metadata-eventDetail="globalMenu" track-metadata-position="nav"> <span class="devsite-nav-text" tooltip > What's new </span> </a> </li> </ul> </div> </div> </nav> </devsite-book-nav> <section id="gc-wrapper"> <main role="main" class="devsite-main-content" has-book-nav has-sidebar > <div class="devsite-sidebar"> <div class="devsite-sidebar-content"> <devsite-toc class="devsite-nav" role="navigation" aria-label="On this page" depth="2" scrollbars ></devsite-toc> <devsite-recommendations-sidebar class="nocontent devsite-nav"> </devsite-recommendations-sidebar> </div> </div> <devsite-content> <article class="devsite-article"> <div class="devsite-article-meta nocontent" role="navigation"> <ul class="devsite-breadcrumb-list" aria-label="Breadcrumb"> <li class="devsite-breadcrumb-item "> <a href="https://developer.chrome.com/" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="1" track-type="globalNav" track-name="breadcrumb" track-metadata-position="1" track-metadata-eventdetail="" > Home </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="2" track-type="globalNav" track-name="breadcrumb" track-metadata-position="2" track-metadata-eventdetail="Docs" > Docs </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs/devtools" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="3" track-type="globalNav" track-name="breadcrumb" track-metadata-position="3" track-metadata-eventdetail="Chrome DevTools" > Chrome DevTools </a> </li> <li class="devsite-breadcrumb-item "> <div class="devsite-breadcrumb-guillemet material-icons" aria-hidden="true"></div> <a href="https://developer.chrome.com/docs/devtools/security" class="devsite-breadcrumb-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Breadcrumbs" data-value="4" track-type="globalNav" track-name="breadcrumb" track-metadata-position="4" track-metadata-eventdetail="" > More panels </a> </li> </ul> <devsite-thumb-rating position="header"> </devsite-thumb-rating> </div> <h1 class="devsite-page-title" tabindex="-1"> Security: Understand security issues </h1> <devsite-feature-tooltip ack-key="AckCollectionsBookmarkTooltipDismiss" analytics-category="Site-Wide Custom Events" analytics-action-show="Callout Profile displayed" analytics-action-close="Callout Profile dismissed" analytics-label="Create Collection Callout" class="devsite-page-bookmark-tooltip nocontent" dismiss-button="true" id="devsite-collections-dropdown" dismiss-button-text="Dismiss" close-button-text="Got it"> <devsite-bookmark></devsite-bookmark> <span slot="popout-heading"> Stay organized with collections </span> <span slot="popout-contents"> Save and categorize content based on your preferences. </span> </devsite-feature-tooltip> <div class="devsite-page-title-meta"><devsite-view-release-notes></devsite-view-release-notes></div> <devsite-toc class="devsite-nav" depth="2" devsite-toc-embedded > </devsite-toc> <div class="devsite-article-body clearfix "> <p><style> .wd-authors { --avatar-size: 65px; display: flex; gap: 2em; } .wd-author { display: flex; flex-wrap: wrap; gap: 1em; line-height: calc(var(--avatar-size) / 2); } .wd-author img { border-radius: 50%; height: var(--avatar-size, 65px); width: var(--avatar-size, 65px); } .dcc-authors { --avatar-size: 65px; display: flex; gap: 2em; } .dcc-author { display: flex; flex-wrap: wrap; gap: 1em; line-height: calc(var(--avatar-size) / 2); } .dcc-author img { border-radius: 50%; height: var(--avatar-size, 65px); width: var(--avatar-size, 65px); } .dcc-author__links a { margin-inline-end: 6px; } .dcc-author__links a:last-of-type { margin-inline-end: 0; } </style> <div class="dcc-authors" translate="no"> <div class="dcc-author"> <img class="devsite-landing-row-item-icon" alt="Kayce Basques" src="https://web.dev/images/authors/kaycebasques.jpg" decoding="async" height="64" loading="lazy" width="64"> <div> <span> Kayce Basques </span> <div class="dcc-author__links"> <a href="https://twitter.com/kaycebasques" aria-label="Kayce Basques on X" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 300 271"> <title>X</title> <path fill="currentColor" d="m236 0h46l-101 115 118 156h-92.6l-72.5-94.8-83 94.8h-46l107-123-113-148h94.9l65.5 86.6zm-16.1 244h25.5l-165-218h-27.4z"></path> </svg></a> <a href="https://github.com/kaycebasques" aria-label="Kayce Basques on GitHub" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32.6 31.8"> <title>GitHub</title> <path d="M16.3 0C7.3 0 0 7.3 0 16.3c0 7.2 4.7 13.3 11.1 15.5.8.1 1.1-.4 1.1-.8v-2.8c-4.5 1-5.5-2.2-5.5-2.2-.7-1.9-1.8-2.4-1.8-2.4-1.5-1 .1-1 .1-1 1.6.1 2.5 1.7 2.5 1.7 1.5 2.5 3.8 1.8 4.7 1.4.1-1.1.6-1.8 1-2.2-3.6-.4-7.4-1.8-7.4-8.1 0-1.8.6-3.2 1.7-4.4-.1-.3-.7-2 .2-4.2 0 0 1.4-.4 4.5 1.7 1.3-.4 2.7-.5 4.1-.5 1.4 0 2.8.2 4.1.5 3.1-2.1 4.5-1.7 4.5-1.7.9 2.2.3 3.9.2 4.3 1 1.1 1.7 2.6 1.7 4.4 0 6.3-3.8 7.6-7.4 8 .6.5 1.1 1.5 1.1 3V31c0 .4.3.9 1.1.8 6.5-2.2 11.1-8.3 11.1-15.5C32.6 7.3 25.3 0 16.3 0z" fill-rule="evenodd" clip-rule="evenodd" fill="currentColor" /> </svg></a> <a href="https://glitch.com/@kaycebasques" aria-label="Kayce Basques on Glitch" rel="me"> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32 32"> <title>Glitch</title> <path fill="currentColor" d="M31.734 16.76c-.385-.198-4.536 1.865-5.427 1.693-2.24-.401-1.828-.667-4.839-1.359-1.203-.266-1.031-.109-1.297-.307-.172-.135-.344-.161-.599-.401 4-.719 6.026-1.693 6.734-1.839.76-.146 5.161 1.958 5.427 1.469.266-.495-.964-1.578-.401-3.031.589-1.464-.693-2.422.016-3.583.719-1.161.573-2.932.396-3.026-.396-.203-4.531 1.865-5.438 1.693-2.24-.417-1.828-.682-4.839-1.359-1.203-.271-1.031-.12-1.297-.323-.266-.198-.521-.13-1.036-.974-.521-.839-6.51-2.13-6.906-2.13-.828 0-2.375 2.13-2.375 2.13s-.599 0-2.401.094c-1.802.094-3.375.896-5.495 2.563C-.173 9.737.134 11.414.134 11.414s1.969.667 1.969 1.042c0 .359-1.729.802-1.729.802 1.12 1.411 4.583 2.745 5.464 2.745h.693c-1.438.281-2.823 1.068-4.583 2.438-2.12 1.698-1.813 3.375-1.813 3.375s1.969.667 1.969 1.026-1.729.802-1.729.802c1.12 1.427 4.583 2.76 5.464 2.76.844 0 1.427.026 2.495-.172.078.172.906 1.932 2.599 2.292 1.786.385 2.776.078 2.776.078s.094-.786-.323-1.573c1.547.161 3.307.203 5.026-.068 4.76-.719 7.12-1.865 7.896-2.01.76-.161 5.161 1.948 5.427 1.464.266-.505-.964-1.583-.385-3.036.573-1.469-.708-2.417 0-3.589.719-1.161.573-2.932.396-3.026zM4.615 11.828a1.446 1.446 0 0 1-.297-.042h-.052c-.026-.01-.052-.026-.078-.042l-.052-.01-.083-.042h-.052a.418.418 0 0 1-.068-.042l-.068-.052-.063-.036-.057-.042c-.021-.016-.042-.036-.063-.052l-.042-.042c-.026-.026-.047-.052-.068-.078l-.026-.031a1.954 1.954 0 0 1-.094-.104l-.026-.026c-.021-.036-.036-.073-.052-.109l-.026-.036-.057-.083c-.005-.021-.016-.042-.026-.063l-.026-.083-.026-.052-.016-.094-.01-.068c-.01-.026-.021-.052-.026-.078v-.068c.094.573.557 1.016 1.104 1.016.63 0 1.146-.573 1.146-1.297 0-.719-.505-1.307-1.146-1.307-.625 0-1.13.573-1.146 1.281 0-.932.667-1.693 1.495-1.693.823 0 1.479.745 1.479 1.682 0 .932-.667 1.693-1.479 1.693zm-1-1.265c0-.203.13-.365.318-.365s.307.161.307.365c0 .198-.135.344-.307.344s-.318-.161-.318-.344zm1 11.651a.712.712 0 0 1-.146 0l-.057-.016a.6.6 0 0 1-.094-.01l-.052-.016-.078-.026-.052-.026c-.031-.005-.057-.016-.083-.026l-.052-.026c-.021-.016-.047-.026-.068-.042L3.881 22l-.068-.052-.052-.042-.068-.052-.042-.042c-.031-.031-.063-.057-.089-.094a.671.671 0 0 1-.094-.12l-.031-.026c-.016-.031-.036-.063-.052-.094l-.026-.052c-.016-.026-.036-.052-.052-.078l-.026-.057-.026-.094-.026-.052-.031-.094-.01-.052c-.01-.031-.021-.063-.026-.094v-.068c.094.573.557 1.016 1.104 1.016.63 0 1.146-.573 1.146-1.292 0-.724-.505-1.297-1.146-1.297-.625 0-1.13.563-1.146 1.266 0-.932.667-1.693 1.495-1.693.823 0 1.479.76 1.479 1.682 0 .917-.667 1.693-1.479 1.693zm-1-1.266c0-.188.13-.349.318-.349s.307.161.307.349c0 .188-.135.344-.307.344s-.318-.146-.318-.344zm6.77-7.333v-.042l.042-.078.078-.297c.182-.583.344-1.172.479-1.771.161-.708.229-1.281.203-1.599-.016-.12-.031-.245-.052-.359a8.276 8.276 0 0 0-.521-1.724l-.083-.172-.026-.068c-.12-.266.057-.573.323-.557h.188l.531.036 2.104.109 1.151.078a28.24 28.24 0 0 1 10.573 2.828l.891.401c.172.078.266.307.188.505-.068.188-.266.292-.438.214l-.896-.401a27.695 27.695 0 0 0-10.359-2.786l-1.146-.068-.51-.026-1.599-.094h-.156c.188.51.339 1.031.453 1.562l.063.427c.042.453-.036 1.078-.224 1.88l-.203.823a23.62 23.62 0 0 1-.385 1.323l-.026.078v.042c-.068.188-.266.292-.438.214-.177-.068-.271-.292-.203-.495zm-2-6.349a.307.307 0 0 1 .479.026c.208.26.396.536.563.828.292.531.495 1.068.547 1.615.026.307 0 .651-.052 1.026a8.718 8.718 0 0 1-.271 1.104c-.094.313-.208.62-.333.922-.078.188-.276.266-.453.172-.172-.094-.24-.318-.156-.521l.026-.052.068-.172c.073-.198.146-.396.214-.599.099-.328.182-.661.24-1 .052-.307.063-.573.052-.802a3.47 3.47 0 0 0-.453-1.292 4.794 4.794 0 0 0-.443-.667l-.036-.042a.417.417 0 0 1 .026-.531zm1.537 13.869c-.063.38-.151.76-.271 1.13a9.549 9.549 0 0 1-.333.906c-.078.188-.276.266-.453.177-.172-.094-.24-.323-.156-.521l.026-.057.068-.172c.073-.198.146-.396.214-.599.099-.328.182-.661.24-1 .052-.307.063-.573.036-.802a3.365 3.365 0 0 0-.438-1.276 4.794 4.794 0 0 0-.443-.667l-.036-.057a.417.417 0 0 1 .026-.531.3.3 0 0 1 .464 0c.214.266.396.547.563.839.292.536.495 1.083.547 1.615.026.307 0 .651-.052 1.026zm16.531.157c-.068.188-.266.297-.438.214l-.896-.401a27.695 27.695 0 0 0-10.359-2.786l-1.135-.063h-.063l-.458-.026c-.583-.036-1.172-.068-1.755-.094l.036.078c.234.615.396 1.255.479 1.906.042.453-.036 1.078-.224 1.88l-.203.828a24.99 24.99 0 0 1-.385 1.333l-.026.068v.036c-.068.203-.266.297-.438.229a.42.42 0 0 1-.203-.51v-.026l.042-.078.078-.292c.182-.589.344-1.177.479-1.776.161-.708.229-1.281.203-1.599-.016-.12-.031-.24-.052-.359a7.996 7.996 0 0 0-.521-1.708l-.052-.12-.031-.068-.026-.063c-.12-.271.057-.578.323-.563h.188l.531.042 2.12.104 1.135.083a28.14 28.14 0 0 1 10.573 2.823l.891.401c.172.078.266.307.188.505z"/> </svg></a> </div> </div> </div> </div></p> <p>Use the <strong>Security</strong> panel in Chrome DevTools to make sure HTTPS is properly implemented on a page. See <a href="https://web.dev/why-https-matters/">Why HTTPS Matters</a> to learn why every website should be protected with HTTPS, even sites that don't handle sensitive user data.</p> <h2 id="overview" data-text="Overview" tabindex="-1">Overview</h2> <p>The <strong>Security</strong> panel is the main place in DevTools for inspecting the security of a page. The <strong>Security</strong> panel gives you an overview of your page's origins that includes HTTP security warnings, origin details and certificates.</p> <h2 id="open" data-text="Open the Security panel" tabindex="-1">Open the Security panel</h2> <p>To open the <strong>Security</strong> panel, follow these steps:</p> <ol> <li><a href="/docs/devtools/open">Open DevTools</a>.</li> <li>Open the <strong>Command menu</strong> by pressing: <ul> <li>macOS: <kbd>Command</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd></li> <li>Windows, Linux, ChromeOS: <kbd>Control</kbd>+<kbd>Shift</kbd>+<kbd>P</kbd></li> </ul></li> <li><p>Start typing <code translate="no" dir="ltr">security</code>, select <strong>Show Security panel</strong>, and press <kbd>Enter</kbd>.</p> <p><img src="/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6.png" alt="The Security panel." width="800" height="566" srcset="https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/the-security-panel-fb87410ac98f6_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 1</strong>. The Security panel</p></li> </ol> <p>Alternatively, in the top right corner, select <span class="material-symbols-outlined">more_vert</span> <strong>More options</strong> > <strong>More tools</strong> > <strong>Security</strong>.</p> <h2 id="problems" data-text="Common problems" tabindex="-1">Common problems</h2> <h3 id="main" data-text="Non-secure main origins" tabindex="-1">Non-secure main origins</h3> <p>When the main origin of a page is not secure, the <strong>Security Overview</strong> says <strong>This page is not secure</strong>.</p> <p><img src="/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516.png" alt="A non-secure page" width="800" height="530" srcset="https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/a-non-secure-page-f4ff43a3cc516_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 2</strong>. A non-secure page</p> <p>This problem occurs when the URL that you visited was requested over HTTP. To make it secure you need to request it over HTTPS. For example, if you look at the URL in your address bar, it probably looks similar to <code translate="no" dir="ltr">http://example.com</code>. To make it secure the URL should be <code translate="no" dir="ltr">https://example.com</code>.</p> <p>If you've already got HTTPS set up on your server, all you need to do to fix this problem is configure your server to redirect all HTTP requests to HTTPS.</p> <p>If you don't have HTTPS set up on your server, <a href="https://letsencrypt.org/">Let's Encrypt</a> provides a free and relatively-easy way to start the process. Or, you might consider hosting your site on a CDN. Most major CDNs host sites on HTTPS by default now.</p> <aside class="tip"><strong>Tip:</strong><span> The <a href="https://web.dev/redirects-http/">Redirect HTTP Traffic To HTTPS</a> audit in <a href="/docs/lighthouse">Lighthouse</a> can help automate the process of making sure that all HTTP requests are redirected to HTTPS.</span></aside> <h3 id="mixed" data-text="Mixed content" tabindex="-1">Mixed content</h3> <p><a href="https://web.dev/what-is-mixed-content/">Mixed content</a> means that the main origin of a page is secure, but the page requested resources from non-secure origins. Mixed content pages are only partially protected because the HTTP content is accessible to sniffers and vulnerable to man-in-the-middle attacks.</p> <p><img src="/static/docs/devtools/security/image/mixed-content-c37bf78f06b17.png" alt="Mixed content." width="800" height="589" srcset="https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-content-c37bf78f06b17_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 3</strong>. Mixed content</p> <p>In <strong>Figure 3</strong>, clicking <strong>View 1 request in Network panel</strong> opens the <strong>Network</strong> panel and applies the <code translate="no" dir="ltr">mixed-content:displayed</code> filter so that the <strong>Network Log</strong> only shows non-secure resources.</p> <p><img src="/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f.png" alt="Mixed resources in the Network Log." width="800" height="514" srcset="https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/mixed-resources-the-netw-91676b4a6161f_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 4</strong>. Mixed resources in the Network Log</p> <h2 id="details" data-text="View details" tabindex="-1">View details</h2> <h3 id="certificate" data-text="View main origin certificate" tabindex="-1">View main origin certificate</h3> <p>From the <strong>Security Overview</strong> click <strong>View certificate</strong> to quickly inspect the main origin's certificate.</p> <p><img src="/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f.png" alt="A main origin certificate." width="800" height="566" srcset="https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/a-main-origin-certificate-046d5ba79067f_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 5</strong>. A main origin certificate</p> <h3 id="origindetails" data-text="View origin details" tabindex="-1">View origin details</h3> <p>Click one of the entries in the left-hand nav to view the origin's details. From the details page you can view connection and certificate information. Certificate transparency information is also shown when available.</p> <p><img src="/static/docs/devtools/security/image/main-origin-details-2769c17b26b56.png" alt="Main origin details." width="800" height="848" srcset="https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_36.png 36w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_48.png 48w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_72.png 72w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_96.png 96w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_480.png 480w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_720.png 720w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_856.png 856w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_960.png 960w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_1440.png 1440w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_1920.png 1920w,https://developer.chrome.com/static/docs/devtools/security/image/main-origin-details-2769c17b26b56_2880.png 2880w" sizes="(max-width: 840px) 100vw, 856px"></p> <p><strong>Figure 6</strong>. Main origin details</p> </div> <devsite-thumb-rating position="footer"> </devsite-thumb-rating> <div class="devsite-floating-action-buttons"> </div> </article> <devsite-content-footer class="nocontent"> <p>Except as otherwise noted, the content of this page is licensed under the <a href="https://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 License</a>, and code samples are licensed under the <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache 2.0 License</a>. For details, see the <a href="https://developers.google.com/site-policies">Google Developers Site Policies</a>. Java is a registered trademark of Oracle and/or its affiliates.</p> <p>Last updated 2024-09-27 UTC.</p> </devsite-content-footer> <devsite-notification > </devsite-notification> <div class="devsite-content-data"> <template class="devsite-content-data-template"> [[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-09-27 UTC."],[],[]] </template> </div> </devsite-content> </main> <devsite-footer-promos class="devsite-footer"> </devsite-footer-promos> <devsite-footer-linkboxes class="devsite-footer"> <nav class="devsite-footer-linkboxes nocontent" aria-label="Footer links"> <ul class="devsite-footer-linkboxes-list"> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Contribute</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://issuetracker.google.com/issues/new?component=1400036&template=1897236" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > File a bug </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://issuetracker.google.com/issues?q=status:open%20componentid:1400036&s=created_time:desc" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > See open issues </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Related content</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://blog.chromium.org/" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > Chromium updates </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/case-studies" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > Case studies </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/deprecated" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Archive </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://web.dev/shows" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > Podcasts & shows </a> </li> </ul> </li> <li class="devsite-footer-linkbox "> <h3 class="devsite-footer-linkbox-heading no-link">Follow</h3> <ul class="devsite-footer-linkbox-list"> <li class="devsite-footer-linkbox-item"> <a href="https://twitter.com/ChromiumDev" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 1)" > @ChromiumDev on X </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://www.youtube.com/user/ChromeDevelopers" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 2)" > YouTube </a> </li> <li class="devsite-footer-linkbox-item"> <a href="https://www.linkedin.com/showcase/chrome-for-developers" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 3)" > Chrome for Developers on LinkedIn </a> </li> <li class="devsite-footer-linkbox-item"> <a href="/static/blog/feed.xml" class="devsite-footer-linkbox-link gc-analytics-event" data-category="Site-Wide Custom Events" data-label="Footer Link (index 4)" > RSS </a> </li> </ul> </li> </ul> </nav> </devsite-footer-linkboxes> <devsite-footer-utility class="devsite-footer"> <div class="devsite-footer-utility nocontent"> <nav class="devsite-footer-utility-links" aria-label="Utility links"> <ul class="devsite-footer-utility-list"> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/terms" data-category="Site-Wide Custom Events" data-label="Footer Terms link" > Terms </a> </li> <li class="devsite-footer-utility-item "> <a class="devsite-footer-utility-link gc-analytics-event" href="//policies.google.com/privacy" data-category="Site-Wide Custom Events" data-label="Footer Privacy link" > Privacy </a> </li> <li class="devsite-footer-utility-item glue-cookie-notification-bar-control"> <a class="devsite-footer-utility-link gc-analytics-event" href="#" data-category="Site-Wide Custom Events" data-label="Footer Manage cookies link" aria-hidden="true" > Manage cookies </a> </li> </ul> <devsite-language-selector> <ul role="presentation"> <li role="presentation"> <a role="menuitem" lang="en" >English</a> </li> <li role="presentation"> <a role="menuitem" lang="de" >Deutsch</a> </li> <li role="presentation"> <a role="menuitem" lang="es_419" >Español – América Latina</a> </li> <li role="presentation"> <a role="menuitem" lang="fr" >Français</a> </li> <li role="presentation"> <a role="menuitem" lang="id" >Indonesia</a> </li> <li role="presentation"> <a role="menuitem" lang="it" >Italiano</a> </li> <li role="presentation"> <a role="menuitem" lang="nl" >Nederlands</a> </li> <li role="presentation"> <a role="menuitem" lang="pl" >Polski</a> </li> <li role="presentation"> <a role="menuitem" lang="pt_br" >Português – Brasil</a> </li> <li role="presentation"> <a role="menuitem" lang="vi" >Tiếng Việt</a> </li> <li role="presentation"> <a role="menuitem" lang="tr" >Türkçe</a> </li> <li role="presentation"> <a role="menuitem" lang="ru" >Русский</a> </li> <li role="presentation"> <a role="menuitem" lang="he" >עברית</a> </li> <li role="presentation"> <a role="menuitem" lang="ar" >العربيّة</a> </li> <li role="presentation"> <a role="menuitem" lang="fa" >فارسی</a> </li> <li role="presentation"> <a role="menuitem" lang="hi" >हिंदी</a> </li> <li role="presentation"> <a role="menuitem" lang="bn" >বাংলা</a> </li> <li role="presentation"> <a role="menuitem" lang="th" >ภาษาไทย</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_cn" >中文 – 简体</a> </li> <li role="presentation"> <a role="menuitem" lang="zh_tw" >中文 – 繁體</a> </li> <li role="presentation"> <a role="menuitem" lang="ja" >日本語</a> </li> <li role="presentation"> <a role="menuitem" lang="ko" >한국어</a> </li> </ul> </devsite-language-selector> </nav> </div> </devsite-footer-utility> <devsite-panel></devsite-panel> </section></section> <devsite-sitemask></devsite-sitemask> <devsite-snackbar></devsite-snackbar> <devsite-tooltip ></devsite-tooltip> <devsite-heading-link></devsite-heading-link> <devsite-analytics> <script type="application/json" analytics>[]</script> <script type="application/json" tag-management>{"at": "True", "ga4": [], "ga4p": [], "gtm": [{"id": "GTM-5QF3RT2", "purpose": 0}], "parameters": {"internalUser": "False", "language": {"machineTranslated": "False", "requested": "en", "served": "en"}, "pageType": "article", "projectName": "Chrome DevTools", "signedIn": "False", "tenant": "chrome", "recommendations": {"sourcePage": "", "sourceType": 0, "sourceRank": 0, "sourceIdenticalDescriptions": 0, "sourceTitleWords": 0, "sourceDescriptionWords": 0, "experiment": ""}, "experiment": {"ids": ""}}}</script> </devsite-analytics> <devsite-badger></devsite-badger> <script nonce="dgVNLu6tQ9FI3b6VIuMdUEyak2QpCx"> (function(d,e,v,s,i,t,E){d['GoogleDevelopersObject']=i; t=e.createElement(v);t.async=1;t.src=s;E=e.getElementsByTagName(v)[0]; E.parentNode.insertBefore(t,E);})(window, document, 'script', 'https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/js/app_loader.js', '[53,"en",null,"/js/devsite_app_module.js","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome","https://chrome-dot-devsite-v2-prod-3p.appspot.com",1,null,["/_pwa/chrome/manifest.json","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/images/video-placeholder.svg","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/favicon.png","https://www.gstatic.com/devrel-devsite/prod/v870e399c64f7c43c99a3043db4b3a74327bb93d0914e84a0c3dba90bbfd67625/chrome/images/lockup.svg","https://fonts.googleapis.com/css?family=Google+Sans:400,500|Roboto:400,400italic,500,500italic,700,700italic|Roboto+Mono:400,500,700&display=swap"],1,null,[1,6,8,12,14,17,21,25,50,52,63,70,75,76,80,87,91,92,93,97,98,100,101,102,103,104,105,107,108,109,110,112,113,116,117,118,120,122,124,125,126,127,129,130,131,132,133,134,135,136,138,140,141,147,148,149,151,152,156,157,158,159,161,163,164,168,169,170,179,180,182,183,186,191,193,196],"AIzaSyCNm9YxQumEXwGJgTDjxoxXK6m1F-9720Q","AIzaSyCc76DZePGtoyUjqKrLdsMGk_ry7sljLbY","developer.chrome.com","AIzaSyB9bqgQ2t11WJsOX8qNsCQ6U-w91mmqF-I","AIzaSyAdYnStPdzjcJJtQ0mvIaeaMKj7_t6J_Fg",null,null,null,["Cloud__enable_cloud_facet_chat","Cloud__enable_legacy_calculator_redirect","MiscFeatureFlags__emergency_css","Profiles__enable_completecodelab_endpoint","Profiles__enable_profile_collections","BookNav__enable_tenant_cache_key","Search__enable_suggestions_from_borg","Cloud__enable_free_trial_server_call","Search__enable_page_map","MiscFeatureFlags__enable_variable_operator","MiscFeatureFlags__enable_explain_this_code","TpcFeatures__enable_mirror_tenant_redirects","Profiles__enable_public_developer_profiles","MiscFeatureFlags__developers_footer_image","Concierge__enable_pushui","Profiles__enable_complete_playlist_endpoint","Profiles__enable_dashboard_curated_recommendations","Search__enable_ai_eligibility_checks","Cloud__enable_llm_concierge_chat","Search__enable_dynamic_content_confidential_banner","DevPro__enable_cloud_innovators_plus","Cloud__enable_cloud_shell","TpcFeatures__enable_required_headers","Profiles__enable_developer_profiles_callout","Profiles__enable_page_saving","Cloud__enable_cloudx_ping","MiscFeatureFlags__enable_firebase_utm","MiscFeatureFlags__enable_view_transitions","Cloud__enable_cloud_dlp_service","DevPro__enable_developer_subscriptions","MiscFeatureFlags__developers_footer_dark_image","Cloud__enable_cloudx_experiment_ids","Profiles__enable_release_notes_notifications","Cloud__enable_cloud_shell_fte_user_flow","CloudShell__cloud_shell_button","Profiles__require_profile_eligibility_for_signin","Experiments__reqs_query_experiments","OnSwitch__enable","CloudShell__cloud_code_overflow_menu","MiscFeatureFlags__enable_project_variables","Analytics__enable_clearcut_logging","Profiles__enable_recognition_badges","Profiles__enable_awarding_url","EngEduTelemetry__enable_engedu_telemetry"],null,null,"AIzaSyA58TaKli1DculwmAmbpzLVGuWc8eCQgQc","https://developerscontentserving-pa.googleapis.com","AIzaSyDWBU60w0P9hEkr29kkksYs8Z7gvZ8u_wc","https://developerscontentsearch-pa.googleapis.com",2,4,null,"https://developerprofiles-pa.googleapis.com",[53,"chrome","Chrome for Developers","developer.chrome.com",null,"chrome-dot-devsite-v2-prod-3p.appspot.com",null,null,[null,null,null,null,null,null,null,null,null,null,null,[1],null,null,null,null,null,null,[1],null,null,null,null,[1,null,1],[1,1,null,1,1]],null,[69,null,null,null,null,null,"/images/lockup.svg","/images/touchicon-180.png",null,null,null,1,1,null,null,null,null,null,null,null,null,2,null,null,null,"/images/lockup-dark-theme.svg",[]],[],null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,null,[[],[1,1]],[[null,null,null,null,null,["GTM-5QF3RT2"],null,null,null,null,null,[["GTM-5QF3RT2",1]],1]],null,4]]') </script> <devsite-a11y-announce></devsite-a11y-announce> </body> </html>

CINXE.COM

Security: Understand security issues | Chrome DevTools | Chrome for Developers