This article explains how to enable dark mode for page source in Chrome. Over the last few years, the dark mode has gained huge popularity, as a result, all the popular apps and tools have a dark mode now. Most of the programming IDE already had dark mode and now you can get the same on View Page Source too.
Enable Dark Mode for Page Source in Chrome
Night Viewer is available for a vast range of web browsers including Google Chrome, Mozilla Firefox, Microsoft Edge, Opera, Vivaldi, Brave, and much more. You get a version of the extension for your web browser by following this link. After installing the extension, you can access it from the menubar.
The general way to access the page source is by using the right-click context menu. This opens a new tab and shows the page source there. When you access the extension from the menubar, it shows a giant toggle in the middle to enable and disable the extension. When the extension is activated, it fetches the page source and shows a button to view the current page source.
When you click the page source button from the extension, it opens the page source in a popup. The popup has a darkened background with colored current page source code on top. At the top, it shows the URL to the webpage with options to change the font, beautify code, and initial and current source.
- Initial Source: Show source code before JS execution (returned from the server)
- Current Source: Show source code after JS execution (same as Developer Tools)
This is how you can enable the dark mode on view page source. With this extension, you can darken the page source to make it easy on eyes in low light environments. The ability to change the font, beautify code, and check JS execution is like a cherry on top for web developers and programmers.