diff --git a/ui/controls.js b/ui/controls.js
index 2761268938..14806f7f59 100644
--- a/ui/controls.js
+++ b/ui/controls.js
@@ -648,7 +648,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
    * @export
    */
   isPiPAllowed() {
-    if ('documentPictureInPicture' in window) {
+    if ('documentPictureInPicture' in window &&
+        this.config_.preferDocumentPictureInPicture) {
       return true;
     }
     if (document.pictureInPictureEnabled) {
@@ -663,7 +664,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
    * @export
    */
   isPiPEnabled() {
-    if ('documentPictureInPicture' in window) {
+    if ('documentPictureInPicture' in window &&
+        this.config_.preferDocumentPictureInPicture) {
       return !!window.documentPictureInPicture.window;
     } else {
       return !!document.pictureInPictureElement;
@@ -673,7 +675,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
   /** @export */
   async togglePiP() {
     try {
-      if ('documentPictureInPicture' in window) {
+      if ('documentPictureInPicture' in window &&
+        this.config_.preferDocumentPictureInPicture) {
         await this.toggleDocumentPictureInPicture_();
       } else if (!document.pictureInPictureElement) {
         // If you were fullscreen, leave fullscreen first.
diff --git a/ui/externs/ui.js b/ui/externs/ui.js
index 4999add000..f41e35864f 100644
--- a/ui/externs/ui.js
+++ b/ui/externs/ui.js
@@ -87,7 +87,8 @@ shaka.extern.UIVolumeBarColors;
  *   enableTooltips: boolean,
  *   keyboardSeekDistance: number,
  *   keyboardLargeSeekDistance: number,
- *   fullScreenElement: HTMLElement
+ *   fullScreenElement: HTMLElement,
+ *   preferDocumentPictureInPicture: boolean
  * }}
  *
  * @property {!Array.<string>} controlPanelElements
@@ -193,6 +194,12 @@ shaka.extern.UIVolumeBarColors;
  * @property {HTMLElement} fullScreenElement
  *   DOM element on which fullscreen will be done.
  *   Defaults to Shaka Player Container.
+ * @property {boolean} preferDocumentPictureInPicture
+ *   Indicates whether the Document Picture in Picture API is preferred or the
+ *   Video Element Picture in Picture API is preferred.
+ *   Changing this property in mid-playback may produce undesired behavior if
+ *   you are already in PiP.
+ *   Defaults to true.
  * @exportDoc
  */
 shaka.extern.UIConfiguration;
diff --git a/ui/ui.js b/ui/ui.js
index f6599e3e2b..3a0476d9f8 100644
--- a/ui/ui.js
+++ b/ui/ui.js
@@ -245,6 +245,7 @@ shaka.ui.Overlay = class {
       keyboardSeekDistance: 5,
       keyboardLargeSeekDistance: 60,
       fullScreenElement: this.videoContainer_,
+      preferDocumentPictureInPicture: true,
     };
 
     // eslint-disable-next-line no-restricted-syntax