LeetCode before and after
Real screenshots of the LeetCode Two Sum problem page, signed out, taken with the extension. They are not mockups.
Engine used: CSS Engine
How to turn on dark mode for LeetCode
- Add ThemeSwitcher to Chrome from the Chrome Web Store. It is free, and the side panel needs Chrome 114 or newer.
- Open leetcode.com in a tab.
- Click the ThemeSwitcher icon in the toolbar to open the side panel.
- Choose CSS Engine and turn dark mode on. ThemeSwitcher remembers both for leetcode.com. Alt+Shift+D toggles it from the keyboard.
- If something looks wrong, press Report this site as broken. It shows the domain it will send, and sends only after you press Send report.
What changes on LeetCode
- Both panes turn dark: the problem statement, examples and constraints on the left, and the code editor on the right.
- Code in the editor keeps its syntax highlighting colours on the dark background.
- The Easy difficulty tag, the orange Premium badge and the green Submit button stay coloured.
- The sign-in prompt under the editor (You need to log in / sign up to run or submit) turns into a dark blue bar with readable text.
Frequently asked questions
Does the code editor turn dark too?
Yes. In the screenshot the editor pane turns dark and the code keeps its syntax highlighting colours.
Which engine was used for these screenshots?
The CSS engine. It recolors backgrounds and text by contrast. You pick it in the side panel, and ThemeSwitcher remembers it for leetcode.com.
Does ThemeSwitcher read my code or submissions?
No. Everything runs on your device, and ThemeSwitcher never sends page addresses, page content or anything you type. The optional usage report is off unless you turn it on and never includes sites. A broken-site report is sent only when you confirm it, and it contains just the domain, engine, theme label and version.