diff --git a/packages/dashboard-ui-components/src/components/alert.tsx b/packages/dashboard-ui-components/src/components/alert.tsx
index c6c0b461d..52a26947b 100644
--- a/packages/dashboard-ui-components/src/components/alert.tsx
+++ b/packages/dashboard-ui-components/src/components/alert.tsx
@@ -23,7 +23,7 @@ const variantStyles = new Map<DesignAlertVariant, VariantStyles>([
   [
     "default",
     {
-      container: "bg-background border-border",
+      container: "border-black/[0.08] bg-white/90 ring-1 ring-black/[0.06] dark:border-border dark:bg-background dark:ring-0",
       icon: "text-foreground",
       title: "text-foreground",
     },
@@ -55,9 +55,9 @@ const variantStyles = new Map<DesignAlertVariant, VariantStyles>([
   [
     "info",
     {
-      container: "bg-blue-500/[0.06] border-blue-500/30",
-      icon: "text-blue-500",
-      title: "text-blue-600 dark:text-blue-400",
+      container: "border-blue-500/20 bg-blue-50/90 ring-1 ring-blue-500/10 dark:border-blue-500/30 dark:bg-blue-500/[0.06] dark:ring-0",
+      icon: "text-blue-600 dark:text-blue-400",
+      title: "text-blue-700 dark:text-blue-400",
     },
   ],
 ]);
diff --git a/packages/dashboard-ui-components/src/components/badge.tsx b/packages/dashboard-ui-components/src/components/badge.tsx
index 73bd6d3ba..83731dc25 100644
--- a/packages/dashboard-ui-components/src/components/badge.tsx
+++ b/packages/dashboard-ui-components/src/components/badge.tsx
@@ -94,7 +94,7 @@ export function DesignBadge({
   return (
     <div
       className={cn(
-        "inline-flex items-center gap-1.5 rounded-full font-medium",
+        "inline-flex max-w-full items-center gap-1.5 whitespace-nowrap rounded-full font-medium leading-none",
         colorClasses,
         sizeClasses
       )}
diff --git a/packages/dashboard-ui-components/src/components/button.tsx b/packages/dashboard-ui-components/src/components/button.tsx
index e60483eaa..67ec8017c 100644
--- a/packages/dashboard-ui-components/src/components/button.tsx
+++ b/packages/dashboard-ui-components/src/components/button.tsx
@@ -17,10 +17,10 @@ const designButtonVariants = cva(
         destructive:
           "bg-destructive text-destructive-foreground hover:bg-destructive/90",
         outline:
-          "border border-input bg-white/85 dark:bg-background hover:bg-white dark:hover:bg-accent hover:text-accent-foreground",
+          "border border-input bg-white/85 dark:bg-background hover:bg-zinc-50 dark:hover:bg-accent dark:hover:text-accent-foreground",
         secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost: "hover:bg-accent hover:text-accent-foreground",
+          "bg-white dark:bg-secondary text-secondary-foreground hover:bg-zinc-50 dark:hover:bg-secondary/80",
+        ghost: "hover:bg-zinc-100 dark:hover:bg-accent dark:hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
         plain: "",
       },