diff --git a/blazor/combobox/accessibility.md b/blazor/combobox/accessibility.md
index 16bdde836d..82acd86b6c 100644
--- a/blazor/combobox/accessibility.md
+++ b/blazor/combobox/accessibility.md
@@ -120,7 +120,7 @@ N> In the following sample, pressing the <kbd>t</kbd> key disables the ComboBox
     }
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hZBAsrrQgPQyWcgL?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LXVHDHhgBFCbvDHE?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 ## Ensuring accessibility
 
diff --git a/blazor/combobox/cascading.md b/blazor/combobox/cascading.md
index b95b9547ed..5af407727f 100644
--- a/blazor/combobox/cascading.md
+++ b/blazor/combobox/cascading.md
@@ -25,7 +25,7 @@ In the following example, selecting a country in the first ComboBox loads its st
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rDLUsVBmKweKQSWe?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Cascading in Blazor ComboBox](./images/cascading/blazor_combobox_cascading.gif)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVxXHBAraxYWUoo?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Cascading in Blazor ComboBox](./images/cascading/blazor_combobox_cascading.webp)" %}
 
 ## Cascading with other form field 
 
@@ -39,6 +39,6 @@ In the following example, the ComboBox lists countries, and textboxes display th
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BthKWhhGKcenJwTt?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Cascading with other form field in Blazor ComboBox](./images/cascading/blazor_combobox_cascading-with-other-form-field.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BXLxZdLUKDDGkuiV?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Cascading with other form field in Blazor ComboBox](./images/cascading/blazor_combobox_cascading-with-other-form-field.webp)" %}
 
 N> [View the cascading ComboBox demo](https://blazor.syncfusion.com/demos/combobox/cascading?theme=bootstrap5).
\ No newline at end of file
diff --git a/blazor/combobox/custom-value.md b/blazor/combobox/custom-value.md
index 0a063c65d5..5299fcf22c 100644
--- a/blazor/combobox/custom-value.md
+++ b/blazor/combobox/custom-value.md
@@ -95,4 +95,4 @@ The following example demonstrates a scenario where users can select an existing
 
 N> Custom values can also be committed using the keyboard by pressing **Enter** when the desired text is typed in the input field.
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LNBnjMBqrTWEjiBq?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with custom value](./images/blazor-combobox-custom-value.gif)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LNBnjMBqrTWEjiBq?appbar=false&editor=true&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with custom value](./images/blazor-combobox-custom-value.webp)" %}
diff --git a/blazor/combobox/data-binding.md b/blazor/combobox/data-binding.md
index 46ec7fb4c8..fb7c15295f 100644
--- a/blazor/combobox/data-binding.md
+++ b/blazor/combobox/data-binding.md
@@ -56,7 +56,7 @@ Bind by index using the `bind-Index` attribute (supports int and nullable int).
     };
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LZhqshBGgdWoItJf?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rtLRjRBKrMMUsYzE?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 ### DataBound event
 
diff --git a/blazor/combobox/data-source.md b/blazor/combobox/data-source.md
index 251af74346..19c59ba72e 100644
--- a/blazor/combobox/data-source.md
+++ b/blazor/combobox/data-source.md
@@ -72,7 +72,7 @@ In the following example, the Name property is mapped to the Text field and the
     };
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VXBKsLLcKnxcdvLv?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Binding Blazor ComboBox Items](./images/blazor-combobox-binding-items.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hXhHjnhgLbUFEzQC?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Binding Blazor ComboBox Items](./images/blazor-combobox-binding-items.webp)" %}
 
 ### Array of complex data
 
@@ -119,7 +119,7 @@ public IEnumerable<Complex> LocalData { get; set; } = new Complex().GetData();
 }
 ```
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rZrqiLVwKHwhTfxb?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Binding Complex Items with Blazor ComboBox](./images/blazor-combobox-complex-data.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BXVnDnhgrPutbGCz?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Binding Complex Items with Blazor ComboBox](./images/blazor-combobox-complex-data.webp)" %}
 
 ## Binding remote data
 
@@ -155,7 +155,7 @@ In the following sample, the first six records are retrieved from the Orders ent
     }
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VthUChrmAnbDTsys?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-binding-data.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rNVRNHrgBkDqblbJ?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-binding-data.webp)" %}
 
 ### Web API Adaptor
 
@@ -182,7 +182,7 @@ Use the WebApiAdaptor to bind the ComboBox to a Web API endpoint (including serv
     }
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hjBgiVLwKnloDWBQ?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Web API Data](./images/blazor-combobox-web-api-data.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hZBHXnVKBkBgQedI?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Web API Data](./images/blazor-combobox-web-api-data.webp)" %}
 
 ### Custom adaptor
 
@@ -294,7 +294,7 @@ The following example demonstrates remote data binding with offline mode enabled
 }
 ```
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LtBACrBQKGCrmiJb?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox in Offline Mode](./images/blazor-combobox-web-api-data.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LZBxtdBKhuKaJKQF?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox in Offline Mode](./images/blazor-combobox-web-api-data.webp)" %}
 
 ### ValueTuple data binding
 
@@ -310,7 +310,7 @@ Bind [ValueTuple](https://learn.microsoft.com/en-us/dotnet/api/system.valuetuple
 </SfComboBox>
 
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rDrKihrcgcMdJUXG?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox ValueTuple Data](./images/blazor_combobox_valuetuple.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hNBnNnLUrYpqeIVv?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox ValueTuple Data](./images/blazor_combobox_valuetuple.webp)" %}
 
 ## Binding ExpandoObject
 
@@ -433,7 +433,7 @@ Bind [ObservableCollection](https://learn.microsoft.com/en-us/dotnet/api/system.
 }
 
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hDBgCBVcAmhLLFOi?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with observable collection data binding](./images/blazor_combobox_observable-collection.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VthdjdLghuIjzTtA?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with observable collection data binding](./images/blazor_combobox_observable-collection.webp)" %}
 
 ## Entity Framework
 
@@ -570,7 +570,7 @@ Now, configure the ComboBox using the **SfDataManager** to interact with the cre
     }
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BjBqiBLcAGhEHVHQ?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VXLnjdrUVEHsDxfD?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 ### Configure cascading in the Blazor ComboBox component
 
diff --git a/blazor/combobox/disabled-items.md b/blazor/combobox/disabled-items.md
index ee711b7bb5..96fcc01487 100644
--- a/blazor/combobox/disabled-items.md
+++ b/blazor/combobox/disabled-items.md
@@ -19,7 +19,7 @@ In the following sample, items are disabled based on a data field mapped to Disa
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BXVfjnWVJFyoSyKz?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LtLntRLUrLALCUzc?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 ## Disable Item Method
 
diff --git a/blazor/combobox/filtering.md b/blazor/combobox/filtering.md
index 7bf4b8c165..ae4cb6e411 100644
--- a/blazor/combobox/filtering.md
+++ b/blazor/combobox/filtering.md
@@ -129,7 +129,7 @@ For instance, the data source item consists of `FirstName` as `Nancy` and `LastN
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BXLKsLVmKwTcWkyh?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rjhxNHrAhsLxHtkd?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 ## Prevent popup opening when filtering
 
diff --git a/blazor/combobox/form-validation.md b/blazor/combobox/form-validation.md
index 935f386c4d..49bf3ccab0 100644
--- a/blazor/combobox/form-validation.md
+++ b/blazor/combobox/form-validation.md
@@ -29,4 +29,4 @@ When the ComboBox input is valid, the form is ready to be submitted. If the inpu
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hXrKWVrGUcRBhJQE?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox inside editform](./images/form-validation/blazor_combobox_inside-editform.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LNLdDxhqUDbRLhul?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox inside editform](./images/form-validation/blazor_combobox_inside-editform.webp)" %}
diff --git a/blazor/combobox/getting-started-with-server-app.md b/blazor/combobox/getting-started-with-server-app.md
index 0910f27e36..4306935c2c 100644
--- a/blazor/combobox/getting-started-with-server-app.md
+++ b/blazor/combobox/getting-started-with-server-app.md
@@ -168,7 +168,7 @@ N> If the Interactivity Location is set to `Global`, the render mode is automati
 
 * Press <kbd>Ctrl</kbd>+<kbd>F5</kbd> (Windows) or <kbd>⌘</kbd>+<kbd>F5</kbd> (macOS) to launch the application. This will render the Blazor ComboBox component in the default web browser.
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rtBpNiBuBWhiNjHa?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VXBHjxLUikIdTQQh?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
 
 ## Binding data source
 
@@ -206,7 +206,7 @@ After initializing, populate the ComboBox with data using the [DataSource](https
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VtBpjsLOhCBHPRgS?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hjrHjxrgLNFyvxFi?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
 
 ## Custom values
 
@@ -222,7 +222,7 @@ The ComboBox allows users to input custom values that are not present in the pre
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVzXMVOrszHZiMo?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LZrRZxVUVjaLAgas?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
 
 ## Configure the popup list
 
@@ -238,7 +238,7 @@ By default, the popup list width automatically matches the ComboBox input width,
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rZBpXirahMIhXWui?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Customizing Popup Height and Width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LtrRXdVgVNHePjPf?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Customizing Popup Height and Width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
 
 N> [View Sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-Started-Examples/tree/main/ComboBox).
 
diff --git a/blazor/combobox/getting-started-with-web-app.md b/blazor/combobox/getting-started-with-web-app.md
index c93998a67b..db957c76e5 100644
--- a/blazor/combobox/getting-started-with-web-app.md
+++ b/blazor/combobox/getting-started-with-web-app.md
@@ -176,7 +176,7 @@ N> If the **Interactivity Location** is set to `Global` with `Auto` or `WebAssem
 
 * Press <kbd>Ctrl</kbd>+<kbd>F5</kbd> (Windows) or <kbd>⌘</kbd>+<kbd>F5</kbd> (macOS) to launch the application. This will render the Blazor ComboBox component in the default web browser.
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rtBpNiBuBWhiNjHa?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VXBHjxLUikIdTQQh?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
 
 ## Binding data source
 
@@ -214,7 +214,7 @@ After initializing, populate the ComboBox with data using the [DataSource](https
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VtBpjsLOhCBHPRgS?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hjrHjxrgLNFyvxFi?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
 
 ## Custom values
 
@@ -230,7 +230,7 @@ The ComboBox allows users to input custom values that are not present in the pre
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVzXMVOrszHZiMo?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LZrRZxVUVjaLAgas?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
 
 ## Configure the popup list
 
@@ -246,7 +246,7 @@ By default, the popup list width automatically matches the ComboBox input width,
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rZBpXirahMIhXWui?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Customizing Popup Height and Width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LtrRXdVgVNHePjPf?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Customizing Popup Height and Width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
 
 N> [View Sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-Started-Examples/tree/main/ComboBox).
 
diff --git a/blazor/combobox/getting-started.md b/blazor/combobox/getting-started.md
index d7ee6f94ac..a5531412bf 100644
--- a/blazor/combobox/getting-started.md
+++ b/blazor/combobox/getting-started.md
@@ -157,7 +157,7 @@ Add the Blazor ComboBox component in the **~/Pages/Index.razor** file.
 
 * Press <kbd>Ctrl</kbd>+<kbd>F5</kbd> (Windows) or <kbd>⌘</kbd>+<kbd>F5</kbd> (macOS) to launch the application. This will render the Blazor ComboBox component in the default web browser.
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rtBpNiBuBWhiNjHa?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VXBHjxLUikIdTQQh?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox Component](./images/blazor-combobox-component.webp)" %}
 
 ## Binding data source
 
@@ -195,7 +195,7 @@ After initialization, populate the ComboBox with data using the [DataSource](htt
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VtBpjsLOhCBHPRgS?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hjrHjxrgLNFyvxFi?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Data Binding](./images/blazor-combobox-data-binding.webp)" %}
 
 ## Custom values
 
@@ -211,7 +211,7 @@ The ComboBox supports custom values that are not present in the predefined list.
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVzXMVOrszHZiMo?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LZrRZxVUVjaLAgas?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Custom Values](./images/blazor-combobox-custom-values.webp)" %}
 
 ## Configure the popup list
 
@@ -227,7 +227,7 @@ By default, the popup list width automatically adjusts to the ComboBox input wid
 {% endhighlight %}
 {% endtabs %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rZBpXirahMIhXWui?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Customizing popup height and width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LtrRXdVgVNHePjPf?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Customizing popup height and width in Blazor ComboBox](./images/blazor-combobox-popup-customization.webp)" %}
 
 N> [View sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-Started-Examples/tree/main/ComboBox).
 
diff --git a/blazor/combobox/grouping.md b/blazor/combobox/grouping.md
index 5eb7c9a41f..522bf671a3 100644
--- a/blazor/combobox/grouping.md
+++ b/blazor/combobox/grouping.md
@@ -23,7 +23,7 @@ In the following sample, vegetables are grouped according to their category usin
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BXrAsLhwUmUFCjYX?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Grouping in Blazor ComboBox](./images/blazor-combobox-grouping.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hXVdjRhqhWSkjMJQ?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Grouping in Blazor ComboBox](./images/blazor-combobox-grouping.webp)" %}
 
 ## Fixed group header
 
diff --git a/blazor/combobox/how-to/tooltip.md b/blazor/combobox/how-to/tooltip.md
index de8dd541e5..d630084556 100644
--- a/blazor/combobox/how-to/tooltip.md
+++ b/blazor/combobox/how-to/tooltip.md
@@ -64,4 +64,4 @@ The following example shows how to display a tooltip when hovering over ComboBox
 }
 ```
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/htrqMBVwKYqDMxaA?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor Combobox displays Tooltip for Dropdown Items](../images/blazor-combobox-tooltip.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VtBRDxrqUDmKEzhO?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor Combobox displays Tooltip for Dropdown Items](../images/blazor-combobox-tooltip.webp)" %}
diff --git a/blazor/combobox/images/blazor-combobox-action-failure-template.webp b/blazor/combobox/images/blazor-combobox-action-failure-template.webp
index 0c746ec2b0..225c98ca6b 100644
Binary files a/blazor/combobox/images/blazor-combobox-action-failure-template.webp and b/blazor/combobox/images/blazor-combobox-action-failure-template.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-binding-data.webp b/blazor/combobox/images/blazor-combobox-binding-data.webp
index f9bc382597..7028290c10 100644
Binary files a/blazor/combobox/images/blazor-combobox-binding-data.webp and b/blazor/combobox/images/blazor-combobox-binding-data.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-binding-items.webp b/blazor/combobox/images/blazor-combobox-binding-items.webp
index f583cd8fca..05b5eb3fab 100644
Binary files a/blazor/combobox/images/blazor-combobox-binding-items.webp and b/blazor/combobox/images/blazor-combobox-binding-items.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-complex-data.webp b/blazor/combobox/images/blazor-combobox-complex-data.webp
index 53c5912014..0d582eda47 100644
Binary files a/blazor/combobox/images/blazor-combobox-complex-data.webp and b/blazor/combobox/images/blazor-combobox-complex-data.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-component.webp b/blazor/combobox/images/blazor-combobox-component.webp
index a92cbacdb3..a7b7d54f5b 100644
Binary files a/blazor/combobox/images/blazor-combobox-component.webp and b/blazor/combobox/images/blazor-combobox-component.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-custom-value.webp b/blazor/combobox/images/blazor-combobox-custom-value.webp
index a06d11f64c..4d18d21a72 100644
Binary files a/blazor/combobox/images/blazor-combobox-custom-value.webp and b/blazor/combobox/images/blazor-combobox-custom-value.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-custom-values.webp b/blazor/combobox/images/blazor-combobox-custom-values.webp
index 44c241bee6..9e0eef709b 100644
Binary files a/blazor/combobox/images/blazor-combobox-custom-values.webp and b/blazor/combobox/images/blazor-combobox-custom-values.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-data-binding.webp b/blazor/combobox/images/blazor-combobox-data-binding.webp
index 7409c0d9ce..8f66a24ecf 100644
Binary files a/blazor/combobox/images/blazor-combobox-data-binding.webp and b/blazor/combobox/images/blazor-combobox-data-binding.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-footer-template.webp b/blazor/combobox/images/blazor-combobox-footer-template.webp
index 1e5762e70f..8bb116152a 100644
Binary files a/blazor/combobox/images/blazor-combobox-footer-template.webp and b/blazor/combobox/images/blazor-combobox-footer-template.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-group-template.webp b/blazor/combobox/images/blazor-combobox-group-template.webp
index 6f686fc89f..f36117cfdd 100644
Binary files a/blazor/combobox/images/blazor-combobox-group-template.webp and b/blazor/combobox/images/blazor-combobox-group-template.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-grouping.webp b/blazor/combobox/images/blazor-combobox-grouping.webp
index 8c42a17454..f8e8d46d09 100644
Binary files a/blazor/combobox/images/blazor-combobox-grouping.webp and b/blazor/combobox/images/blazor-combobox-grouping.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-header-template.webp b/blazor/combobox/images/blazor-combobox-header-template.webp
index bc0e0519d8..006bbdd335 100644
Binary files a/blazor/combobox/images/blazor-combobox-header-template.webp and b/blazor/combobox/images/blazor-combobox-header-template.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-item-template.webp b/blazor/combobox/images/blazor-combobox-item-template.webp
index 52b0ba7b9d..a6a7042045 100644
Binary files a/blazor/combobox/images/blazor-combobox-item-template.webp and b/blazor/combobox/images/blazor-combobox-item-template.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-popup-customization.webp b/blazor/combobox/images/blazor-combobox-popup-customization.webp
index 0852db7828..888126cab8 100644
Binary files a/blazor/combobox/images/blazor-combobox-popup-customization.webp and b/blazor/combobox/images/blazor-combobox-popup-customization.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-tooltip.webp b/blazor/combobox/images/blazor-combobox-tooltip.webp
index 7a4c0ae7b2..e63b13ce46 100644
Binary files a/blazor/combobox/images/blazor-combobox-tooltip.webp and b/blazor/combobox/images/blazor-combobox-tooltip.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-web-api-data.webp b/blazor/combobox/images/blazor-combobox-web-api-data.webp
index 7bdc255872..fa3d4e5628 100644
Binary files a/blazor/combobox/images/blazor-combobox-web-api-data.webp and b/blazor/combobox/images/blazor-combobox-web-api-data.webp differ
diff --git a/blazor/combobox/images/blazor-combobox-without-data.webp b/blazor/combobox/images/blazor-combobox-without-data.webp
index 981f4516d1..8ffb7d9eab 100644
Binary files a/blazor/combobox/images/blazor-combobox-without-data.webp and b/blazor/combobox/images/blazor-combobox-without-data.webp differ
diff --git a/blazor/combobox/images/blazor_combobox_observable-collection.webp b/blazor/combobox/images/blazor_combobox_observable-collection.webp
index e81b7e5c54..b4220cf6db 100644
Binary files a/blazor/combobox/images/blazor_combobox_observable-collection.webp and b/blazor/combobox/images/blazor_combobox_observable-collection.webp differ
diff --git a/blazor/combobox/images/blazor_combobox_valuetuple.webp b/blazor/combobox/images/blazor_combobox_valuetuple.webp
index 22b3551406..82855978b8 100644
Binary files a/blazor/combobox/images/blazor_combobox_valuetuple.webp and b/blazor/combobox/images/blazor_combobox_valuetuple.webp differ
diff --git a/blazor/combobox/images/cascading/blazor_combobox_cascading-with-other-form-field.webp b/blazor/combobox/images/cascading/blazor_combobox_cascading-with-other-form-field.webp
index 660c797620..abd5cddea7 100644
Binary files a/blazor/combobox/images/cascading/blazor_combobox_cascading-with-other-form-field.webp and b/blazor/combobox/images/cascading/blazor_combobox_cascading-with-other-form-field.webp differ
diff --git a/blazor/combobox/images/form-validation/blazor_combobox_inside-editform.webp b/blazor/combobox/images/form-validation/blazor_combobox_inside-editform.webp
index 3a716fe09b..1f330cff35 100644
Binary files a/blazor/combobox/images/form-validation/blazor_combobox_inside-editform.webp and b/blazor/combobox/images/form-validation/blazor_combobox_inside-editform.webp differ
diff --git a/blazor/combobox/images/placeholder-and-floatlabel/blazor_combobox_placeholder-with-mandatory.webp b/blazor/combobox/images/placeholder-and-floatlabel/blazor_combobox_placeholder-with-mandatory.webp
index ce48fe9360..9baa0d5fe9 100644
Binary files a/blazor/combobox/images/placeholder-and-floatlabel/blazor_combobox_placeholder-with-mandatory.webp and b/blazor/combobox/images/placeholder-and-floatlabel/blazor_combobox_placeholder-with-mandatory.webp differ
diff --git a/blazor/combobox/images/style/blazor-combobox-tooltip.webp b/blazor/combobox/images/style/blazor-combobox-tooltip.webp
index 2430f5fb04..e63b13ce46 100644
Binary files a/blazor/combobox/images/style/blazor-combobox-tooltip.webp and b/blazor/combobox/images/style/blazor-combobox-tooltip.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_appearance-of-container.webp b/blazor/combobox/images/style/blazor_combobox_appearance-of-container.webp
index 1400499a6b..ad953f529d 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_appearance-of-container.webp and b/blazor/combobox/images/style/blazor_combobox_appearance-of-container.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_appearance-of-popup.webp b/blazor/combobox/images/style/blazor_combobox_appearance-of-popup.webp
index da764c6c70..03d751203c 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_appearance-of-popup.webp and b/blazor/combobox/images/style/blazor_combobox_appearance-of-popup.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_background-color.webp b/blazor/combobox/images/style/blazor_combobox_background-color.webp
index a569c8c5cd..ae07b87e1c 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_background-color.webp and b/blazor/combobox/images/style/blazor_combobox_background-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_disabled-text-color.webp b/blazor/combobox/images/style/blazor_combobox_disabled-text-color.webp
index 5f73650ff6..2a4ee847b5 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_disabled-text-color.webp and b/blazor/combobox/images/style/blazor_combobox_disabled-text-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_floatlabel-focus-color.webp b/blazor/combobox/images/style/blazor_combobox_floatlabel-focus-color.webp
index 9d32aa9efd..cb8e81a67f 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_floatlabel-focus-color.webp and b/blazor/combobox/images/style/blazor_combobox_floatlabel-focus-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_icon-color.webp b/blazor/combobox/images/style/blazor_combobox_icon-color.webp
index 29b31ed4a5..1fff53c60e 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_icon-color.webp and b/blazor/combobox/images/style/blazor_combobox_icon-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_outline-focus-color.webp b/blazor/combobox/images/style/blazor_combobox_outline-focus-color.webp
index e0fb9bbe10..41e5bd1226 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_outline-focus-color.webp and b/blazor/combobox/images/style/blazor_combobox_outline-focus-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_placeholder-color.webp b/blazor/combobox/images/style/blazor_combobox_placeholder-color.webp
index 2105b6f65d..a8b31b0296 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_placeholder-color.webp and b/blazor/combobox/images/style/blazor_combobox_placeholder-color.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_placeholder-with-mandatory.webp b/blazor/combobox/images/style/blazor_combobox_placeholder-with-mandatory.webp
index 66929d97d4..9baa0d5fe9 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_placeholder-with-mandatory.webp and b/blazor/combobox/images/style/blazor_combobox_placeholder-with-mandatory.webp differ
diff --git a/blazor/combobox/images/style/blazor_combobox_readonly-mode.webp b/blazor/combobox/images/style/blazor_combobox_readonly-mode.webp
index 4d26589eec..a3f2658683 100644
Binary files a/blazor/combobox/images/style/blazor_combobox_readonly-mode.webp and b/blazor/combobox/images/style/blazor_combobox_readonly-mode.webp differ
diff --git a/blazor/combobox/images/templates/blazor_combobox_firstname-lastname.webp b/blazor/combobox/images/templates/blazor_combobox_firstname-lastname.webp
index ea9e031e2e..f5e610dedc 100644
Binary files a/blazor/combobox/images/templates/blazor_combobox_firstname-lastname.webp and b/blazor/combobox/images/templates/blazor_combobox_firstname-lastname.webp differ
diff --git a/blazor/combobox/native-events.md b/blazor/combobox/native-events.md
index c48639392b..266dd89f68 100644
--- a/blazor/combobox/native-events.md
+++ b/blazor/combobox/native-events.md
@@ -46,7 +46,7 @@ In the following example, the `KeyPressed` method is invoked whenever a key is p
     };
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/htVgiLrGUlddXtaX?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hXhxDHhKKCZjWPnR?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 Also, rewrite the previous code example as follows using Lambda expressions.
 
@@ -97,7 +97,7 @@ In the following example, the `KeyPressed` method receives `KeyboardEventArgs` a
     };
 }
 ```
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VNrKshBGqFwXkbUb?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hDhnNRBAgCXrFmLn?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" %}
 
 Using Lambda expression also, you can pass the event data to the event handler.
 
diff --git a/blazor/combobox/style.md b/blazor/combobox/style.md
index 6fa47819c6..ac9bd54206 100644
--- a/blazor/combobox/style.md
+++ b/blazor/combobox/style.md
@@ -21,7 +21,7 @@ Specify the boolean value to the [Readonly](https://help.syncfusion.com/cr/blazo
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VXVAiBLQUvNGLyuy?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Readonly mode](./images/style/blazor_combobox_readonly-mode.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LthnjxhghepzTqNR?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Readonly mode](./images/style/blazor_combobox_readonly-mode.webp)" %}
 
 ## Disabled state
 
@@ -65,7 +65,7 @@ Customize the text color of a disabled component by targeting its CSS class `.e-
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hNhqMVBwUFMudrwO?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Disabled component text color](./images/style/blazor_combobox_disabled-text-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LXLdjnLALSIMHIeU?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Disabled component text color](./images/style/blazor_combobox_disabled-text-color.webp)" %}
 
 ## Customizing the appearance of the container element
 
@@ -77,7 +77,7 @@ Customize the ComboBox container by targeting the `.e-input` selector (the paren
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hXhqirLQUlXaeBFy?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox container element customization](./images/style/blazor_combobox_appearance-of-container.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VNhHXdhUBxsHNGMC?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox container element customization](./images/style/blazor_combobox_appearance-of-container.webp)" %}
 
 ## Customizing the dropdown icon’s color
 
@@ -89,7 +89,7 @@ Customize the dropdown [icon](https://ej2.syncfusion.com/documentation/appearanc
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BjrqMBVQKbirhlfh?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox icon color](./images/style/blazor_combobox_icon-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BXhRXdBKhRUvVblR?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox icon color](./images/style/blazor_combobox_icon-color.webp)" %}
 
 ## Customizing the focus color
 
@@ -101,7 +101,7 @@ Customize the component color when it is focused by targeting its CSS class `.e-
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LtLUsVhGUFizesmJ?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox focus color](./images/style/blazor_combobox_focus-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BjLRNdLKVnfPNxmf?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox focus color](./images/style/blazor_combobox_focus-color.webp)" %}
 
 ## Customizing the outline theme’s focus color
 
@@ -113,7 +113,7 @@ Customize the color of the combobox component when it is in a focused state and
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LjhqsVBQKFiQpUgc?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox focusing color outline theme](./images/style/blazor_combobox_outline-focus-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hNVnjRhALnngWbUZ?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox focusing color outline theme](./images/style/blazor_combobox_outline-focus-color.webp)" %}
 
 ## Customizing the background color of focused, hovered, and active items
 
@@ -125,7 +125,7 @@ Customize background and text colors of list items in focused, hovered, or activ
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VZhKWhLwgPKXzzDZ?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with customizing the focus, hover and active item color](./images/style/blazor_combobox_background-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/hjBdtxrULdbSfCgy?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with customizing the focus, hover and active item color](./images/style/blazor_combobox_background-color.webp)" %}
 
 ## Customizing the appearance of the popup element
 
@@ -137,7 +137,7 @@ Customize the popup’s appearance by targeting list item selectors within the p
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BjhqiBVmUPKLSlDK?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with customizing popup color](./images/style/blazor_combobox_appearance-of-popup.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BDhRZRhUrxEeyvKl?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with customizing popup color](./images/style/blazor_combobox_appearance-of-popup.webp)" %}
 
 ## Change the HTML attributes
 
@@ -205,7 +205,7 @@ Change the floating label text color when focused by targeting `.e-input-focus`
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VXhUsLhGgPhWFokH?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with float label focusing color](./images/style/blazor_combobox_floatlabel-focus-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LNBHZHBghcNfBOsL?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with float label focusing color](./images/style/blazor_combobox_floatlabel-focus-color.webp)" %}
 
 ## Customizing the color of the placeholder text
 
@@ -217,7 +217,7 @@ Change the placeholder color by targeting `input.e-input::placeholder` (scope wi
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hjVKMrVQqbhTKwJQ?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with color placeholder](./images/style/blazor_combobox_placeholder-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rjVntHVgBcsSwHQk?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with color placeholder](./images/style/blazor_combobox_placeholder-color.webp)" %}
 
 ## Customizing the placeholder to add a mandatory indicator (*)
 
@@ -229,7 +229,7 @@ Append a visual mandatory indicator to the floating placeholder by targeting `.e
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VjVAsVhmKPrHruAI?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with mandatory indicator placeholder](./images/style/blazor_combobox_placeholder-with-mandatory.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LNBRZxrABcrAFYya?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with mandatory indicator placeholder](./images/style/blazor_combobox_placeholder-with-mandatory.webp)" %}
 
 ## Customizing the text selection color
 
@@ -241,4 +241,4 @@ The appearance of a selected item within a combobox component can be customized
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BNLKCVBGgPVvrliw?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with customizing the focus, hover and active item color](./images/style/blazor_combobox_text-selection-color.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/VjrnDHVghGKaNZaJ?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with customizing the focus, hover and active item color](./images/style/blazor_combobox_text-selection-color.webp)" %}
diff --git a/blazor/combobox/templates.md b/blazor/combobox/templates.md
index c3b84d3da5..adb2cfd57b 100644
--- a/blazor/combobox/templates.md
+++ b/blazor/combobox/templates.md
@@ -27,7 +27,7 @@ In the following example, each list item is split into two columns to display re
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rNVAWhhQgcQzSVPf?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with ItemTemplate](./images/blazor-combobox-item-template.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LXBnDdhgBpiReAjj?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with ItemTemplate](./images/blazor-combobox-item-template.webp)" %}
 
 ## Group template
 
@@ -41,7 +41,7 @@ In the following example, employees are grouped by country.
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rNVKWBVmqQwncaKF?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with GroupTemplate](./images/blazor-combobox-group-template.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/BNLHDHVqLprNHgDv?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with GroupTemplate](./images/blazor-combobox-group-template.webp)" %}
 
 ## Header template
 
@@ -55,7 +55,7 @@ In the following sample, the list items and its headers are designed and display
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVUsLhwAcwvaAlF?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with HeaderTemplate](./images/blazor-combobox-header-template.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LZLxDdhqLzLYYxMC?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with HeaderTemplate](./images/blazor-combobox-header-template.webp)" %}
 
 ## Footer template
 
@@ -69,7 +69,7 @@ In the following sample, footer element displays the total number of list items
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/BtBKWVVwAcviULco?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with FooterTemplate](./images/blazor-combobox-footer-template.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rZrntxhqBpErATei?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with FooterTemplate](./images/blazor-combobox-footer-template.webp)" %}
 
 ## No records template
 
@@ -83,7 +83,7 @@ In the following sample, popup list content displays the notification of no data
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/hZVgWBrwUQlgRDZE?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox without Data](./images/blazor-combobox-without-data.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/LtBnDHLArojDvqmu?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox without Data](./images/blazor-combobox-without-data.webp)" %}
 
 ## Action failure template
 
@@ -97,7 +97,7 @@ In the following sample, when the data fetch request fails, the ComboBox display
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/VtBUMrrcqQlwxTci?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with Action Failure Template](./images/blazor-combobox-action-failure-template.webp)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rZLxtRBAhSiBVkoY?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with Action Failure Template](./images/blazor-combobox-action-failure-template.webp)" %}
 
 ## Combine two fields without Templates
 
@@ -113,4 +113,4 @@ In the `GameFields` class, the `Name` property is defined with the `get` and `se
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rjLKMLBwAQaWEhfL?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Text with firstName and lastName](./images/templates/blazor_combobox_firstname-lastname.webp)" %}
\ No newline at end of file
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rjhHZnVAVSLMcXEb?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Text with firstName and lastName](./images/templates/blazor_combobox_firstname-lastname.webp)" %}
\ No newline at end of file
diff --git a/blazor/combobox/virtualization.md b/blazor/combobox/virtualization.md
index 82e0976035..7ad43bc83f 100644
--- a/blazor/combobox/virtualization.md
+++ b/blazor/combobox/virtualization.md
@@ -21,7 +21,7 @@ This feature is applicable to both local and remote data scenarios, providing fl
 
 {% endhighlight %}
 
-{% previewsample "https://blazorplayground.syncfusion.com/embed/rXBgCVBQqlgGofzc?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor ComboBox with virtualization](./images/blazor_combobox_virtualization.gif)" %}
+{% previewsample "https://blazorplayground.syncfusion.com/embed/rXBnjxhKhVJevbJJ?appbar=false&editor=false&result=true&errorlist=false&theme=fluent2" backgroundimage "[Blazor ComboBox with virtualization](./images/blazor_combobox_virtualization.webp)" %}
 
 ## Remote data