diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor
index 894921b87..e7efd933f 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor
@@ -28,6 +28,10 @@
     <Demo Type="typeof(Toasts_Demo_02_Toast_Without_Title)" />
 </Section>
 
+<Section Size="HeadingSize.H2" Name="Toast with templated content" PageUrl="@pageUrl" Link="toast-with-content">
+    <Demo Type="typeof(Toasts_Demo_07_Toast_With_Content)" />
+</Section>
+
 <Section Size="HeadingSize.H2" Name="Auto hide" PageUrl="@pageUrl" Link="auto-hide">
     <div>Add <code>AutoHide="true"</code> parameter to hide the Blazor Toasts after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.</div>
     <Demo Type="typeof(Toasts_Demo_03_A_Auto_Hide)" />
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/Toasts_Demo_07_Toast_With_Content.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/Toasts_Demo_07_Toast_With_Content.razor
new file mode 100644
index 000000000..5e0c3e1e4
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/Toasts_Demo_07_Toast_With_Content.razor
@@ -0,0 +1,16 @@
+<Toasts class="p-3" Messages="messages" />
+
+<Button Class="btn btn-primary" @onclick="ShowToast">Toast with Content</Button>
+
+@code {
+    List<ToastMessage> messages = [];
+
+    private void ShowToast() =>
+        messages.Add(
+            new ToastMessage
+            {
+                Type = ToastType.Info,
+                Title = "Blazor Bootstrap",
+                Content = @<div>Hello, world! This is a toast message. <button class="btn btn-sm btn-primary mt-2" @onclick="ShowToast">Show more toast</button></div>,
+            });
+}
diff --git a/blazorbootstrap/Components/Toasts/SimpleToast.razor b/blazorbootstrap/Components/Toasts/SimpleToast.razor
index ec0843e9d..a43862409 100644
--- a/blazorbootstrap/Components/Toasts/SimpleToast.razor
+++ b/blazorbootstrap/Components/Toasts/SimpleToast.razor
@@ -6,6 +6,7 @@
         <div class="d-flex">
             <div class="toast-body">
                 @ToastMessage?.Message
+                @ToastMessage?.Content
             </div>
             @if (!AutoHide || ShowCloseButton)
             {
diff --git a/blazorbootstrap/Components/Toasts/Toast.razor b/blazorbootstrap/Components/Toasts/Toast.razor
index 83f4afec7..b35811629 100644
--- a/blazorbootstrap/Components/Toasts/Toast.razor
+++ b/blazorbootstrap/Components/Toasts/Toast.razor
@@ -13,6 +13,7 @@
     </div>
     <div class="toast-body">
         @ToastMessage.Message
+        @ToastMessage.Content
     </div>
     <Progress Height="3">
         <ProgressBar @ref="toastProgressBar" Color="@progressColor" Width="toastProgressBarWidth"/>
diff --git a/blazorbootstrap/Models/ToastMessage.cs b/blazorbootstrap/Models/ToastMessage.cs
index 25482cdf9..316d516c9 100644
--- a/blazorbootstrap/Models/ToastMessage.cs
+++ b/blazorbootstrap/Models/ToastMessage.cs
@@ -102,6 +102,8 @@ public ToastMessage(ToastType type, string customIconName, string title, string
 
     public string? Message { get; set; }
 
+    public RenderFragment? Content { get; set; }
+
     public string? Title { get; set; }
 
     public ToastType Type { get; set; }