DarkModer

A complete recreation of the Dark Reader browser extension as a userscript.

Features

• 4 Theme Engines: Filter, Filter+, Dynamic, and Static modes
• Full Color Control: Brightness, contrast, sepia, grayscale adjustments
• Custom Colors: Configure background and text colors
• Site List: Disable dark mode for specific sites
• Site Rules: Exact hosts, wildcards, regular expressions, and ! exclusions
• Auto-Updating Configs: Configs hosted on GitHub, automatically loaded
• Automation: System preference or time-based activation with optional day/night palettes
• HDR Tone Mapping: Optional highlight compression when the display reports HDR support
• Settings UI: Full settings panel from the userscript manager menu
• Live Preview: Sandboxed current-page thumbnail for adjustment sliders
• Light Pins: Right-click an element to keep it light-themed for the session
• Engine Comparison: Compare two engines in isolated side-by-side previews
• Companion Fix Browser: Search community configs and preview fixes in a sandboxed sample page
• Import/Export: Backup and restore your settings

Installation

1. Install a Userscript Manager

• Tampermonkey (recommended): Chrome | Firefox | Edge
• Violentmonkey: Chrome | Firefox
• Greasemonkey (Firefox): Firefox

2. Install DarkModer

Click here to install

Or manually: Click on DarkReader-Full.user.js in this repo and your userscript manager should prompt you to install it.

3. Usage

• Toggle Settings: Use the userscript manager menu
• Enable/Disable: Use the main toggle in the settings panel
• Per-Site Toggle: Toggle dark mode for the current site
• Change Mode: Switch between Filter, Filter+, Dynamic, or Static

Site lists accept one rule per line. Use an exact host (example.com), a wildcard (*.gov.uk), or a regular expression (/\.internal\.example/). A leading ! excludes a match, so an enabled-site list such as *.gov.uk plus !legacy.* applies only to non-legacy government domains.

Config Files

The static companion fix browser provides searchable config entries and a sandboxed preview without installing the userscript.

DarkModer automatically loads config files from this repository:

File	Purpose
dark-sites.json	Sites already dark (skip list)
dynamic-theme-fixes.json	Per-site CSS fixes for Dynamic mode
inversion-fixes.json	Per-site fixes for Filter modes
static-themes.json	Complete CSS themes for specific sites

Contributing Fixes

Found a site that doesn't look right? You can:

1. Fork this repo
2. Edit the appropriate config file
3. Submit a pull request

Or open an issue with the site URL and description of the problem.

Custom Config URL

Want to host your own configs?

1. Fork this repo or host JSON files on any server
2. Open settings from the userscript manager menu > More tab
3. Enter your config base URL
4. Configs will load from your URL instead

Theme Modes Explained

Filter Mode

• Uses CSS filter: invert(1) hue-rotate(180deg)
• Fast and simple
• May affect images (they get re-inverted)
• Works on most sites

Filter+ Mode

• Uses SVG filters for better color handling
• More vivid colors than Filter mode
• Slightly slower
• Better image handling

Dynamic Mode (Recommended)

• Analyzes page CSS and modifies colors
• Best visual results
• Preserves images naturally
• May be slower on complex pages

Static Mode

• Applies a simple dark CSS override
• Fastest mode
• May not work well on complex sites
• Good for simple pages

API

The userscript exposes a global API for advanced users:

// Access the APIconstDR=window.DarkReaderUserscript;// Enable/disableDR.setEnabled(true);DR.setEnabled(false);// Change engineDR.setEngine('dynamic');// 'filter', 'filterPlus', 'dynamic', 'static'// Change theme optionsDR.setThemeOption('brightness',110);DR.setThemeOption('contrast',95);DR.setThemeOption('sepia',10);DR.setThemeOption('darkSchemeBackgroundColor','#1a1a1a');DR.setThemeOption('darkSchemeTextColor','#e0e0e0');// Toggle siteDR.toggleSite('example.com',true);// Disable for siteDR.toggleSite('example.com',false);// Enable for site// Get current settingsconstsettings=DR.getSettings();// Reset to defaultsDR.resetSettings();// Compare engines or pin a light element for this page sessionDR.compareEngines('dynamic','filter');DR.pinElement(document.querySelector('.color-picker'));

Keyboard Shortcuts

DarkModer does not install page-level keyboard shortcuts. Open settings from the userscript manager menu; press Escape to close the panel.

Theme Modes Explained

Filter Mode

• Uses CSS filter: invert(1) hue-rotate(180deg)
• Fast and simple
• May affect images (they get re-inverted)
• Works on most sites

Filter+ Mode

• Uses SVG filters for better color handling
• More vivid colors than Filter mode
• Slightly slower
• Better image handling

Dynamic Mode (Recommended)

• Analyzes page CSS and modifies colors
• Best visual results
• Preserves images naturally
• May be slower on complex pages

Static Mode

• Applies a simple dark CSS override
• Fastest mode
• May not work well on complex sites
• Good for simple pages

Troubleshooting

Script not working?

1. Make sure your userscript manager is enabled
2. Check if the site is in your disabled list
3. Try switching to Filter mode
4. Clear browser cache and reload

Images look weird?

• Dynamic mode preserves images best
• In Filter mode, images are double-inverted (may still look off)

Site looks broken?

1. Try a different mode
2. Add site to disabled list
3. Open an issue to request a fix

Performance issues?

• Use Filter or Static mode for better performance
• Dynamic mode can be slow on heavy pages

License

MIT License - Same as original Dark Reader

Credits

Based on Dark Reader by Alexander Shutau and contributors.