diff --git a/.changeset/thick-dryers-train.md b/.changeset/thick-dryers-train.md
new file mode 100644
index 000000000..2020539c6
--- /dev/null
+++ b/.changeset/thick-dryers-train.md
@@ -0,0 +1,5 @@
+---
+"@studiocms/ui": patch
+---
+
+Adjusted persistent toasts to include an outline for better visibility
diff --git a/packages/studiocms_ui/src/components/Toast/Toaster.astro b/packages/studiocms_ui/src/components/Toast/Toaster.astro
index 04db7f8b7..513a415c1 100644
--- a/packages/studiocms_ui/src/components/Toast/Toaster.astro
+++ b/packages/studiocms_ui/src/components/Toast/Toaster.astro
@@ -71,7 +71,7 @@ const {
     const toastContainer = document.createElement('div');
     const toastID = generateID('toast');
     toastContainer.id = toastID;
-    toastContainer.classList.add('toast-container', props.type, `${props.closeButton || props.persistent && "closeable"}`);
+    toastContainer.classList.add('toast-container', props.type, `${props.closeButton || props.persistent && "closeable"}`, `${props.persistent && 'persistent'}`);
 
     const toastHeader = document.createElement('div');
     toastHeader.classList.add('toast-header');
@@ -262,6 +262,22 @@ const {
     animation: toast-closing .25s ease forwards;
   }
 
+  .toast-container.persistent {
+    border: 1px solid hsl(var(--primary-base));
+  }
+
+  .toast-container.persistent.success {
+    border: 1px solid hsl(var(--success-base));
+  }
+
+  .toast-container.persistent.warning {
+    border: 1px solid hsl(var(--warning-base));
+  }
+
+  .toast-container.persistent.danger {
+    border: 1px solid hsl(var(--danger-base));
+  }
+
   @keyframes toast-pop-in {
     0% {
       opacity: 0;