Dim everything but media in Chrome or Firefox

Set the focus on what you're watching, not the advertisements around it.

Nicole Cozma
Nicole Cozma has an affinity for Android apps and devices, but loves technology in general. Based out of the Tampa Bay Area, she enjoys being a spectator to both sunsets and lightning storms.
Nicole Cozma

Cinemas dim the lights during showings to help eliminate distractions, making it easier for you to focus on what you came to see. With media sites like YouTube, it's easy to become distracted by the other content on the page like the recommended videos or comments sections. And let's face it, not all videos look good in full-screen mode due to low resolutions. Wouldn't it be nice if you could dim the lights on the rest of the page to cut out the distractions? Well, there happens to be an add-on for Firefox and Chrome that does just that. Follow these three quick steps to recreate the cinematic effect when viewing videos or playing games on the Web:

Extension for Chrome. Screenshot by Nicole Cozma
Add-on for Firefox. Screenshot by Nicole Cozma

Step 1: Download and install Turn Off the Lights for either Chrome or Firefox.

Click the bulb! Screenshot by Nicole Cozma

Step 2: Find a page with media on it. To toggle screen dimming, click on the light bulb icon that appears to the right of the address bar.

Screenshot by Nicole Cozma

Step 3: Enjoy your media with less bright distractions like animated ads and banners.

For added convenience there's an option in the add-on's settings page that can enable automatic screen dimming for you (toggling occurs when the play/pause button is pressed). Many other options exist for to customize the dimming, such as how opaque the overlay is as well as the color, and what other sections of YouTube you'd like to be able to interact with while the screen is dimmed.