How to Watch YouTube in Windowed Fullscreen Mode

I often watch YouTube on my second screen while doing some simple work. However, it’s frustrating when I have to exit YouTube’s full-screen mode to perform another task, such as checking an email or replying to a message, in a different tab.

The Extension Solution

There’s an extension named “YouTube Master” that offers several enhancements, including windowed fullscreen mode. Personally, I prefer to minimize the number of apps and extensions I use, so I developed a custom tweak (explained further below). However, if you’re comfortable with using an additional extension, here are the links to download and explore YouTube Master:

• Chrome Web Store
• App Store

The Custom Solution

So, YouTube features a so-called theater mode. However, I find it somewhat odd due to the bulky black bars on both sides and the limited height of the video. Thankfully, we can adjust this with pure CSS. To achieve the ideal windowed fullscreen mode, we simply need to stretch the video vertically to eliminate of the black bars, and then hide the top menu bar where the logo and search box are located. Here’s the CSS code to do it:

ytd-watch-flexy[theater]:not([fullscreen]) #player-theater-container {
	height: 100vh !important;
	max-height: none !important;
	margin-top: -56px !important;
	z-index: 9999 !important;
}

To implement these changes in Safari I personally use Cascadea, a paid app that allows for custom styling. Alternatively, you can create a CSS file and manually add it through Safari’s preferences:

For Chrome and other browsers, there are numerous extensions similar to Cascadea, as well as built-in features, such as the “Boosts” feature in Arc.

How It Works

To enable windowed fullscreen mode, simply press t or enable theater mode from the bar beneath the video.

Now, instead of this:

… you get this:

Perfection.