diff --git a/docs/pages/cldvideoplayer/configuration.mdx b/docs/pages/cldvideoplayer/configuration.mdx
index 9e1c0eeb..a29a2f71 100644
--- a/docs/pages/cldvideoplayer/configuration.mdx
+++ b/docs/pages/cldvideoplayer/configuration.mdx
@@ -38,6 +38,7 @@ import OgImage from '../../components/OgImage';
 | playerRef          | Ref            | -               | React ref to access Player instance      | See Refs Below               |
 | showLogo           | boolea         | `true`          | Show the Cloudinary logo on Player       | `false`                      |
 | src                | string         | -               | **Required**: Video public ID            | `"videos/my-video"`          |
+| sourceTypes        | array          | -               | Streaming format                         | `['hls']`                    |
 | transformation     | object/array   | -               | Transformations to apply to the video    | `{ width: 200, height: 200, crop: 'fill' }` |
 | version            | string         | `"1.9.16"`      | **Deprecated**                           | -       `                    |
 | videoRef           | Ref            | -               | React ref to access video element        | See Refs Below               |
diff --git a/docs/pages/cldvideoplayer/examples.mdx b/docs/pages/cldvideoplayer/examples.mdx
index 2183d716..e317d335 100644
--- a/docs/pages/cldvideoplayer/examples.mdx
+++ b/docs/pages/cldvideoplayer/examples.mdx
@@ -35,7 +35,7 @@ export const VideoPlayerWithRef = (props) => {
 
 # CldVideoPlayer Examples
 
-## Effects
+## Examples
 
 <ImageGrid columns={1}>
   <li>
@@ -56,6 +56,32 @@ export const VideoPlayerWithRef = (props) => {
     src="videos/mountain-stars"
     ```
   </li>
+  <li>
+    <CldVideoPlayer
+      id="adaptive-streaming"
+      width="1620"
+      height="1080"
+      src={`${process.env.VIDEOS_DIRECTORY}/mountain-stars`}
+      transformation={{
+        streaming_profile: 'hd',
+      }}
+      sourceTypes={['hls']}
+    />
+
+    ### Adaptive Streaming
+
+    Basic settings to display a video.
+
+    ```jsx
+    width="1620"
+    height="1080"
+    src="videos/mountain-stars"
+    transformation={{
+      streaming_profile: 'hd',
+    }}
+    sourceTypes={['hls']}
+    ```
+  </li>
   <li>
     <div style={{ maxWidth: 500, margin: '0 auto' }}>
       <CldVideoPlayer
diff --git a/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.tsx b/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.tsx
index ee815590..0fde6213 100644
--- a/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.tsx
+++ b/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.tsx
@@ -28,6 +28,7 @@ const CldVideoPlayer = (props: CldVideoPlayerProps) => {
     onPlay,
     onEnded,
     src,
+    sourceTypes,
     transformation,
     version = '1.9.16',
     quality = 'auto',
@@ -142,6 +143,10 @@ const CldVideoPlayer = (props: CldVideoPlayerProps) => {
         ...logoOptions
       };
 
+      if ( Array.isArray(sourceTypes) ) {
+        playerOptions.sourceTypes = sourceTypes;
+      }
+
       if ( typeof colors === 'object' ) {
         playerOptions.colors = colors;
       }
diff --git a/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.types.ts b/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.types.ts
index 09505166..54a0bc0b 100644
--- a/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.types.ts
+++ b/next-cloudinary/src/components/CldVideoPlayer/CldVideoPlayer.types.ts
@@ -2,7 +2,7 @@ import { MutableRefObject } from 'react';
 
 import { CloudinaryVideoPlayer, CloudinaryVideoPlayerOptions, CloudinaryVideoPlayerOptionsColors, CloudinaryVideoPlayerOptionsLogo } from '../../types/player';
 
-export type CldVideoPlayerProps = Pick<CloudinaryVideoPlayerOptions, "colors" | "controls" | "fontFace" | "loop" | "muted" | "transformation"> & {
+export type CldVideoPlayerProps = Pick<CloudinaryVideoPlayerOptions, "colors" | "controls" | "fontFace" | "loop" | "muted" | "sourceTypes" | "transformation"> & {
   autoPlay?: string;
   className?: string;
   height: string | number;
diff --git a/next-cloudinary/src/types/player.ts b/next-cloudinary/src/types/player.ts
index 94ab88ee..e328f9c4 100644
--- a/next-cloudinary/src/types/player.ts
+++ b/next-cloudinary/src/types/player.ts
@@ -14,6 +14,7 @@ export interface CloudinaryVideoPlayerOptions {
   secure?: boolean;
   transformation?: Array<object> | object;
   showLogo?: boolean;
+  sourceTypes?: Array<string>;
   logoImageUrl?: string;
   logoOnclickUrl?: string;
 }