What is the "Adjust Screen Brightness" extension?

The "Adjust Screen Brightness" extension allows you to customize your browser's screen brightness levels to reduce eyestrain while reading. You can control the brightness levels for both daytime and nighttime from the toolbar's popup window. It is recommended to use a lower value for nighttime compared to daytime. You can also configure when the daytime and nighttime begin. Additionally, version 0.1.3 of the extension allows you to set custom keyboard shortcuts to increase or decrease the brightness level without the need to use your mouse. To adjust the keyboard shortcut, go to the extensions manager and select "keyboard shortcuts." You can read more about this in the Change Keyboard Commands Offered By Extensions blog post.

What's new in this version?

Please check the Logs section.

What is the "Night Shift (Lux control)" extension?

The "Night Shift (Lux control)" extension allows you to control red, green, and blue color levels for all web pages. It offers two modes of operation: DIV and SVG. In the DIV mode, the extension inserts an HTML DIV element on top of the page with user-defined color and opacity levels, which reduces the page's brightness. Note that this method cannot fully remove a color channel; it just reduces it. In SVG mode, the extension inserts an SVG filter into the page which eliminates a particular color channel based on the user's settings. For example, setting the blue color level to zero at night will cause blue boxes to appear gray since there is no blue channel available. The SVG mode is preferred if your browser supports it, but it may be buggy. If SVG mode causes rendering issues, switch to DIV mode and refresh the page.

How does the "Adjust Screen Brightness" extension reduce the browser's brightness level?

The "Adjust Screen Brightness" extension adds a ":before" CSS pseudo-element over the entire page with the user-defined brightness level. This element reduces the overall brightness of all elements on the page to the desired level. To restore the original brightness level, use the 100% setting, which makes the overlay box transparent and hence has no effect on the brightness level.

In CSS, the ":before" pseudo-element is used to add content before an element. It can add cosmetic content to HTML elements, such as a background image or a punctuation character. The content added with the ":before" pseudo-element is treated as if it were the first child of the element, meaning that it will be positioned and styled accordingly.

Is it possible to use keyboard shortcuts to increase or decrease brightness levels?

The "Adjust Screen Brightness" extension allows you to increase and decrease the brightness level by +/-0.05 percent using browser commands. To customize these commands with keyboard shortcuts on Chrome, open "chrome://extensions/shortcuts" in a browser tab and assign new shortcuts. On Firefox, open "about:addons" in a browser tab, then press the gear button in the top-right corner and select "Manage Extension Shortcuts." From there, you can assign new keyboard shortcuts for the brightness commands.

As of version 0.2.1, the "Adjust Screen Brightness" extension also allows you to open the popup window and adjust the brightness using keyboard shortcuts. To open the popup, assign a shortcut. Once the popup is open, you can use the left and right arrow keys to switch between modes (the active mode has a badge). The active mode's range will be in focus, so you can adjust it without using your mouse. By default, the step size is 1, but you can use the Shift key to increase the step size to 5.

Other shortcuts:

• Ctrl + E or Command + E: Enable on this hostname
• Ctrl + D or Command + D: Disable on this hostname
• Ctrl + T or Command + T: Toggle the global enable and disable state
• Ctrl + W or Command + W: Switch to the "Global" brightness level for this hostname (version 0.2.3)
• Ctrl + H or Command + H: Switch to "per-site" brightness level (version 0.2.3)
• Ctrl + L or Command + L: Lock or unlock dark to light ranges (version 0.3.2)
• Ctrl + U or Command + U: Switch to the schedule interface (version 0.3.8)
• Ctrl + I or Command + I: Switch to the simple interface (version 0.3.8)
• Ctrl + Y or Command + Y: Focus daytime range (version 0.3.8)
• Ctrl + N or Command + N: Focus nighttime range (version 0.3.8)

I would like to have a single range to control the brightness of all day, instead of having two different range elements. Is it possible?

Use the "Lock" button on the interface to lock light to dark ranges.

[deprecated] To use the "Adjust Screen Brightness" extension to control the brightness using only the night time setting (on version 0.2.1 or greater), set the day and night times to the same value. This will cause the night time range to be in control of the brightness. When you open the popup window, you will see that the active badge appears next to the night time, and the night time range will be in focus. You can use the left and right arrow keys to adjust the brightness. This allows you to easily control the brightness using only the night time setting.

On the options page, there are three methods to adjust screen brightness. What is the meaning of each mode?

The "Adjust Screen Brightness" extension offers three options for controlling the brightness of web pages: "Use CSS Brightness Filter," "Use a Dark Div," and "Brightness Filter or Dark Div." The "Use CSS Brightness Filter" option uses a CSS filter to decrease or increase the brightness level. The "Use a Dark Div" option uses a semi-transparent DIV element to darken the view, but cannot increase the brightness. Values above 100% are ignored. The "Brightness Filter or Dark Div" option uses the "Use a Dark Div" method when the brightness level is less than 100%, and the "Use CSS Brightness Filter" method when it is above 100%. The "Use CSS Brightness Filter" method is generally better, but may cause issues on some websites. By default, the "Brightness Filter or Dark Div" (adaptive) mode is used.

Color codes:

• The brightness control is globally active
• The brightness control is globally disabled. Browser tabs have their original brightness.
• The brightness control is disabled for this hostname. You can add or remove hostnames from the popup interface or use the options page. You may need to refresh the tab for the change to take place.
• Brightness control is inactive for this hostname as the website is recognized to support dark mode. You can either deactivate dark mode detection for this hostname or entirely disable automatic deactivation upon dark mode detection from the options page.

What does "Apply brightness control to fullscreen elements" mean on the options page?

This setting determines whether the extension's brightness adjustments are also applied to elements in fullscreen mode—such as a video player. When enabled, the brightness level you've set will affect these fullscreen elements in the same way it does regular page content.

What does "Prevent the native fullscreen backdrop effect on elements" mean?

When a page enters fullscreen on an element (like a video or image), the browser applies default styling—usually dimming the background—using a special ::backdrop pseudo-element. This setting disables that built-in backdrop effect, allowing the fullscreen element to appear without the browser's default visual dimming or background styling.

[Before 0.3.7 release] Can I enable the extension only on a few websites instead of all sites?

By default, the extension works on all sites, but you can configure Chrome or any Chromium-based browsers to limit it to specific websites. Here's how:

1. Enable the extension normally so it can run on all sites.
2. Visit the website where you want the extension to work.
3. Right-click the extension's action button in the toolbar area.
4. Select "This Can Read and Change Site Data".
5. Choose the option to allow access only on the current site instead of "On All Sites".

This effectively places the extension in whitelist mode, where it will only work on the sites you select. To add more sites, simply repeat the steps on each site you want to include.

[After 0.3.7 release] Can I enable the extension only on a few websites instead of all sites?

Visit the options page and on "Change Global Scope" section modify the list. This comma-separated list defines the global scope where the extension injects its brightness control script. You can use it to limit the scope to specific websites, though by default the extension covers all sites. Below are some example patterns. Be careful—an incorrect scope may break the extension. If issues occur, clear the list to reset to the default behavior.

• Use *://*/* to cover all sites.
• Use *://example.com/* to cover example.com and all its subdomains.
• Use *://sub.example.com/* to cover only that specific subdomain.