Repository files navigation

Midnight Lizard web-extension for GoogleChrome™ and MozillaFirefox™ provides custom color schemes for all websites. Each color scheme works on all websites and will never become outdated. There are many predefined color schemes and you can install more frommidnight-lizard.org

✔ Choose between dark, light, grayscale or colorful color schemes
✔ Modify existing or create new color schemes
✔ Use different color schemes on each website
✔ Adjust brightness, saturation, contrast and hues
✔ Improve accessibility and readability
✔ Increase contrast to make text easier to read
✔ Apply blue light filter to shift all colors towards red light
✔ Keep original images and hues without inversion
✔ Schedule automatic activation and deactivation
✔ Or follow system color scheme schedule
✔ Use with PDF and local files (enable in browser settings)
        _{^{PDF processing is available only in Chromium-based browsers}}
✔ Dynamically change Firefox theme (disabled by default)
✔ Shade bright colors and images
✔ Change any colour you want
✔ Synchronize your settings
✔ Configure background, text, buttons, links, borders, images and scrollbars
✔ Apply globally, per-website or with url match patterns
✔ Switch between websites blacklist and whitelist modes
✔ Use Simplified mode to improve performance on heavy websites
✔ Use keyboard shortcuts to toggle extension
  ⮚ on current website: Alt+Shift+L
  ⮚ globally: Alt+Shift+M

This extension has beenupdated to Manifest V3 to comply with Google Chrome's latest requirements. All functionality remains the same while meeting modern extension standards.

⚠️Important: The extension requires building before installation. SeeBuild Instructions below.

This is aTypeScript project that needs to be compiled to JavaScript before it can be installed in Chrome or Firefox. Follow the instructions below for your operating system.

You needNode.js andnpm installed on your system.

Windows:

1. Download Node.js LTS fromnodejs.org
2. Run the installer (.msi file)
3. Accept the license agreement and keep default settings
4. Make sure "Add to PATH" is checked during installation
5. Restart your terminal/PowerShell after installation
6. Verify installation:

   node--versionnpm--version

Linux (Ubuntu/Debian):

# Using NodeSource repository for latest LTS versioncurl -fsSL https://deb.nodesource.com/setup_lts.x| sudo -E bash -sudo apt-get install -y nodejs# Verify installationnode --versionnpm --version

Linux (Fedora/RHEL/CentOS):

# Using NodeSource repositorycurl -fsSL https://rpm.nodesource.com/setup_lts.x| sudo bash -sudo dnf install -y nodejs# Verify installationnode --versionnpm --version

macOS:

# Using Homebrewbrew install node# Verify installationnode --versionnpm --version

1. Open PowerShell or Command Prompt

   • PressWin + X and select "Windows PowerShell" or "Terminal"

2. Navigate to the project directory

   cd C:\path\to\Midnight-Lizard-manifest-3

   ReplaceC:\path\to\ with your actual path

3. Install dependencies

   npm install

   This will download all required packages (~213 packages). Takes 1-2 minutes.

4. Build the extension

   For PowerShell:

   $env:NODE_OPTIONS="--openssl-legacy-provider"; npm run prod-build

   For Command Prompt (cmd):

   setNODE_OPTIONS=--openssl-legacy-provider&& npm run prod-build

5. Verify the build

   dir js

   You should see these files:

   • background-page.js (247 KB)
   • content-script.js (418 KB)
   • popup.js (483 KB)
   • page-script.js (4.7 KB)
   • custom\ folder with additional scripts

✅Build complete! Thejs/ folder now contains all compiled JavaScript files.

1. Open Terminal

   • PressCtrl + Alt + T or open your preferred terminal

2. Navigate to the project directory

   cd /path/to/Midnight-Lizard-manifest-3

   Replace/path/to/ with your actual path

3. Install dependencies

   npm install

   This will download all required packages (~213 packages). Takes 1-2 minutes.

4. Build the extension

   NODE_OPTIONS=--openssl-legacy-provider npm run prod-build

5. Verify the build

   ls -lh js/

   You should see these files:

   • background-page.js (247 KB)
   • content-script.js (418 KB)
   • popup.js (483 KB)
   • page-script.js (4.7 KB)
   • custom/ folder with additional scripts

✅Build complete! Thejs/ folder now contains all compiled JavaScript files.

1. Open Chrome Extensions page

   • Navigate tochrome://extensions/
   • Or: Menu → More Tools → Extensions

2. Enable Developer Mode

   • Toggle the "Developer mode" switch in the top-right corner

3. Load the extension

   • Click "Load unpacked"
   • Select theMidnight-Lizard-manifest-3 folder (the root folder, not thejs/ folder)
   • The extension will now appear in your extensions list

4. Pin the extension (optional)

   • Click the puzzle icon in Chrome toolbar
   • Find "Midnight Lizard" and click the pin icon

✅Installation complete! The extension is now active.

1. Open Firefox Add-ons page

   • Navigate toabout:debugging#/runtime/this-firefox
   • Or: Menu → Add-ons and themes → Settings (gear icon) → Debug Add-ons

2. Load temporary add-on

   • Click "Load Temporary Add-on..."
   • Navigate to theMidnight-Lizard-manifest-3 folder
   • Select themanifest.json file

3. Make it permanent (optional)

   • For permanent installation, you'll need to sign the extension through Mozilla
   • Or rebuild for Firefox:npm run prod-pack:firefox

✅Installation complete! The extension is now active.

npm run watch

This will automatically rebuild the extension whenever you modify TypeScript files.

npm run dev-build

Includes source maps for easier debugging.

npm run prod-build

Optimized build without source maps.

# For Chromenpm run prod-pack:chrome# For Firefoxnpm run prod-pack:firefox# For bothnpm run prod-pack

Creates.zip (Chrome) or.xpi (Firefox) files in thereleases/ folder.

Problem:npm: command not found or'npm' is not recognizedSolution: Install Node.js (seePrerequisites)

Problem:Error: digital envelope routines::unsupportedSolution: Use the legacy OpenSSL provider:NODE_OPTIONS=--openssl-legacy-provider npm run prod-build

Problem: Build warnings about file sizesSolution: These are normal performance warnings and don't affect functionality. You can safely ignore them.

Problem:js/ folder is empty after buildSolution: Make sure the build completed without errors. Check the terminal output for error messages.

Problem: Extension doesn't load in ChromeSolution: Ensure you've built the project first and thejs/ folder exists with all JavaScript files.

🌍Help translate Midnight Lizard into other languages
🐛Found a bug or have a new feature proposal?
💰Donate to help us cover infrastructure expenses