diff --git a/docs/docs/mutations.md b/docs/docs/mutations.md
index 6de8108..960fb1f 100644
--- a/docs/docs/mutations.md
+++ b/docs/docs/mutations.md
@@ -74,6 +74,10 @@ This guide covers
   })),
 ```
 
+import MutationsVideo from '@site/src/components/MutationsVideo';
+
+<MutationsVideo />
+
 But before going into depth of the "How" and "When" to use mutations, it is important to give context about
 the "Why" and "Who" of why mutations were built for the toolkit like this.
 
diff --git a/docs/src/components/MutationsVideo/index.tsx b/docs/src/components/MutationsVideo/index.tsx
new file mode 100644
index 0000000..fcaf9c6
--- /dev/null
+++ b/docs/src/components/MutationsVideo/index.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+import styles from './styles.module.css';
+
+export default function MutationsVideo(): React.JSX.Element {
+  return (
+    <div className={styles.iframeContainer}>    
+      <iframe 
+        className={styles.responsiveIframe}
+        src="https://www.youtube.com/embed/kDGQNizSfa0?start=3257" 
+        title="[EN] Webinar: Reactive Angular with the new NgRx Signal Store" 
+        frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" 
+        referrerpolicy="strict-origin-when-cross-origin" 
+        allowfullscreen>
+      </iframe>
+    </div>
+  );
+}
diff --git a/docs/src/components/MutationsVideo/styles.module.css b/docs/src/components/MutationsVideo/styles.module.css
new file mode 100644
index 0000000..7b26b1f
--- /dev/null
+++ b/docs/src/components/MutationsVideo/styles.module.css
@@ -0,0 +1,15 @@
+.iframeContainer {
+  position: relative;
+  width: 100%;
+  padding-top: 56.25%;
+  overflow: hidden;
+}
+
+.responsiveIframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border: none;
+}
\ No newline at end of file