https://github.com/jalendport/custom-devtools

💻️ A custom unpacked Chrome extension that provides custom fonts and font settings for the Chrome Developer Tools via CSS.
https://github.com/jalendport/custom-devtools

chrome chrome-browser chrome-devtools chrome-extension devtools devtools-extension

Last synced: 2 months ago
JSON representation

💻️ A custom unpacked Chrome extension that provides custom fonts and font settings for the Chrome Developer Tools via CSS.

• Host: GitHub
• URL: https://github.com/jalendport/custom-devtools
• Owner: jalendport
• Created: 2017-12-15T15:45:53.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-12-15T19:43:25.000Z (over 7 years ago)
• Last Synced: 2025-01-24T10:11:15.885Z (4 months ago)
• Topics: chrome, chrome-browser, chrome-devtools, chrome-extension, devtools, devtools-extension
• Language: CSS
• Homepage:
• Size: 423 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
#  Custom Devtools

A custom unpacked Chrome extension that provides custom fonts and font settings for the Chrome Developer Tools via CSS.

![screenshot](images/screenshot.png)

## Installation/Usage

1. Please [download this repo](https://github.com/jalenconner/custom-devtools/archive/master.zip) and unzip the folder. Move it somewhere safe.

1. Open Chrome. Enable "Developer Tools Experiments" in Chrome's Flags (`chrome://flags/#enable-devtools-experiments`). After enabling that flag, please restart Chrome.

1. Open the Developer Tool Settings. Under "Experiments" please check "Allow Custom UI Themes". Please close the Developer Tools.

1. Navigate to the Chrome Extensions page (`chrome://extensions/`) and make sure Developer Mode is checked. You should see a button that says "Load Unpacked Extension"; click on that and navigate to the folder you downloaded in step 1. You can uncheck Developer Mode now if you want.

1. Feel free to edit any of the css in the extension folder or add your own if you want.

- Bonus: If you want the dark theme that you see in the screenshot, that can be turned on in the Developer Tool Settings.