Firefox remove controls + fade from Popout Video Player

You can remove all of those Firefox Picture-in-Picture controls — including the dark fade/gradient — permanently, even when you move the mouse over the pop-out window.

Firefox does not provide a normal setting or about:config preference to hide the playback controls themselves; Mozilla explicitly confirms this. But the PiP window can be customised with userChrome.css, and Firefox’s current PiP code puts the buttons and bottom gradient in the .control-item class.

1. Enable custom Firefox CSS

Enter this in Firefox:

about:config

Search for:

toolkit.legacyUserProfileCustomizations.stylesheets

Set it to:

true

2. Open your Firefox profile

Enter:

about:support

Find:

Profile Folder → Open Folder

Inside that folder create a folder called:

chrome

Then inside chrome, create:

userChrome.css

3. Put this in userChrome.css

/* Completely hide Firefox Picture-in-Picture controls */
@-moz-document url("chrome://global/content/pictureinpicture/player.xhtml") {

    /* Hide buttons, timeline, volume, seek, close, return-to-tab etc. */
    *|*.control-item {
        display: none !important;
    }

    /* Hide the dark/faded gradient at the bottom */
    *|*#controls-bottom-gradient {
        display: none !important;
        opacity: 0 !important;
        background: none !important;
    }

    /* Hide any subtitle/settings popup */
    *|*#settings {
        display: none !important;
    }
}

Then completely close Firefox and reopen it.