diff --git a/doc/Learn/Markup/Overview.md b/doc/Learn/Markup/Overview.md
index 2860da12a0..2679523999 100644
--- a/doc/Learn/Markup/Overview.md
+++ b/doc/Learn/Markup/Overview.md
@@ -16,6 +16,17 @@ You will quickly discover why C# Markup is a developer favorite with:
 - Refactoring support
 - Custom Controls and 3rd party libraries
 
+<div style="position: relative; width: 100%; padding-bottom: 56.25%;">
+    <iframe
+        src="https://www.youtube-nocookie.com/embed/BC3c1qO_kbU"
+        title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        allowfullscreen
+        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
+    </iframe>
+</div>
+
 Let's jump in and take a look at a simple sample that displays 'Hello Uno Platform!' in the center of the screen:
 
 ```cs
diff --git a/doc/Learn/Markup/Resources.md b/doc/Learn/Markup/Resources.md
index e566660e2e..030e84f185 100644
--- a/doc/Learn/Markup/Resources.md
+++ b/doc/Learn/Markup/Resources.md
@@ -5,6 +5,17 @@ uid: Uno.Extensions.Markup.Resources
 
 All `FrameworkElement`-inheriting types and `Application` have a couple of special extensions to help you manage your resources.
 
+<div style="position: relative; width: 100%; padding-bottom: 56.25%;">
+    <iframe
+        src="https://www.youtube-nocookie.com/embed/W3P9Vd8QuGY"
+        title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        allowfullscreen
+        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
+    </iframe>
+</div>
+
 ## Merging Resource Dictionaries
 
 To merge resource dictionaries, you simply need to add a `ResourceDictionary` to the `Application` or `FrameworkElement` like:
diff --git a/doc/Learn/Markup/Styles.md b/doc/Learn/Markup/Styles.md
index 0162d28d5e..37332a089e 100644
--- a/doc/Learn/Markup/Styles.md
+++ b/doc/Learn/Markup/Styles.md
@@ -10,6 +10,17 @@ new Style<TextBlock>()
     .Setters(s => s.FontSize(14))
 ```
 
+<div style="position: relative; width: 100%; padding-bottom: 56.25%;">
+    <iframe
+        src="https://www.youtube-nocookie.com/embed/McQi0-JCciw"
+        title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        allowfullscreen
+        style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
+    </iframe>
+</div>
+
 ## Using Attached Properties
 
 By default the C# Markup Generators will provide friendly extension methods for properties on the given type for `Style<T>`. This provides an API that is friendly and familiar to the XAML you might be used to as shown in the example above. Sometimes you may need to use Attached DependencyProperties for which there is no generated extension for `Style<T>`, in these cases you can simply call the Add method and pass in both the DependencyProperty and the value: