Changes: Track your HTML, CSS, and JavaScript changes

Sofia Emelianova

Use the Changes panel to track code changes made within DevTools.

Overview

With the Changes panel, track the changes you make to:

• HTML in Sources with enabled Local overrides
• CSS in Elements > Styles or Sources
• JavaScript in Sources

The Changes panel shows only the changes you make within DevTools. If you reload either DevTools or your page, the changes disappear.

To make DevTools persist changes across page loads, follow the steps in Local overrides.

To make DevTools write changes to your local sources, follow the steps in Edit and save files with Workspaces.

Open the Changes panel

To open the Changes panel:

1. Open DevTools.

2. Press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux, ChromeOS) to open the Command Menu.

3. Start typing changes, select Show Changes, and press Enter.