Overview Open Chrome DevTools What's New in DevTools DevTools tips Simulate mobile devices with Device Mode Performance insights: Get actionable insights on your website's performance Lighthouse: Optimize website speed Animations: Inspect and modify CSS animation effects Changes: Track your HTML, CSS, and JavaScript changes Coverage: Find unused JavaScript and CSS Developer Resources: View and manually load source maps CSS Overview: Identify potential CSS improvements Issues: Find and fix problems Media: View and debug media players information Memory Inspector: Inspect ArrayBuffer, TypedArray, DataView, and Wasm Memory. Network conditions: Override the user agent string Security: Understand security issues Search: Find text across all loaded resources Sensors: Emulate device sensors WebAuthn: Emulate authenticators Customize DevTools Engineering blog
Overview Open Chrome DevTools What's New in DevTools DevTools tips Simulate mobile devices with Device Mode Performance insights: Get actionable insights on your website's performance Lighthouse: Optimize website speed Animations: Inspect and modify CSS animation effects Changes: Track your HTML, CSS, and JavaScript changes Coverage: Find unused JavaScript and CSS Developer Resources: View and manually load source maps CSS Overview: Identify potential CSS improvements Issues: Find and fix problems Media: View and debug media players information Memory Inspector: Inspect ArrayBuffer, TypedArray, DataView, and Wasm Memory. Network conditions: Override the user agent string Security: Understand security issues Search: Find text across all loaded resources Sensors: Emulate device sensors WebAuthn: Emulate authenticators Customize DevTools Engineering blog

View, add, edit, and delete cookies

Published on Updated on

Caution

Your site may use third-party cookies and it's time to take action as we approach their deprecation. To learn what to do about affected cookies, see Preparing for the end of third-party cookies.

HTTP Cookies are mainly used to manage user sessions, store user personalization preferences, and track user behavior. They are also the cause of all of those annoying "this page uses cookies" consent forms that you see across the web. This guide teaches you how to view, add, edit, and delete a page's cookies with Chrome DevTools.

Open the Cookies pane

  1. Open Chrome DevTools.
  2. Open Application > Storage > Cookies and select an origin.
The Cookies pane.

Fields

The Cookies table contains the following fields:

  • Name. The cookie's name.
  • Value. The cookie's value.
  • Domain. The hosts that are allowed to receive the cookie.
  • Path. The URL that must exist in the requested URL in order to send the Cookie header.
  • Expires / Max-Age. The cookie's expiration date or maximum age. For session cookies this value is always Session.
  • Size. The cookie's size, in bytes.
  • HttpOnly. If true, this field indicates that the cookie should only be used over HTTP, and JavaScript modification is not allowed.
  • Secure. If true, this field indicates that the cookie can only be sent to the server over a secure, HTTPS connection.
  • SameSite. Contains Strict or Lax if the cookie is using the experimental SameSite attribute.
  • Partition Key. For cookies with independent partition state, the partition key is the site of the top-level URL the browser was visiting at the start of the request to the endpoint that set the cookie.
  • Priority. Contains Low, Medium (default), or High if using deprecated cookie Priority attribute.

To view a cookie's value, select it in the table. To see the value without percent-encoding, check Checkbox. Show URL-decoded.

Filter cookies

Use the Filter text box to filter cookies by Name or Value.

Filtering out any cookies that don't contain 'id'.

Filtering by other fields is not supported. Filter is case-insensitive.

To add an arbitrary cookie:

  1. Double-click an empty row in the table.
  2. Enter a Name and Value and press Enter.

DevTools populates other required fields automatically. You can edit them as described next.

Edit a cookie

All the fields are editable except Size that updates automatically.

Double-click a field to edit it.

Setting the name of a cookie to 'DEVTOOLS!'

DevTools highlights cookies with invalid field values in red.

A cookie with an invalid in Partition Key value.

To filter out valid cookies, check Checkbox. Only show cookies with an issue in the top action bar.

Delete cookies

To delete a cookie, select it and click Delete selected. Delete selected in the top action bar.

Deleting a selected cookie.

Click Clear. Clear all to delete all cookies.

Clearing all cookies.

Updated on Improve article

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.