diff --git a/src/theme/badge.ts b/src/theme/badge.ts
index 6f2ecb26..033bbaa6 100644
--- a/src/theme/badge.ts
+++ b/src/theme/badge.ts
@@ -32,11 +32,11 @@ export default (options: Required<ModuleOptions>) => ({
   })), ...options.colors.map((color: string) => ({
     color,
     variant: 'soft',
-    class: `bg-${color}-50 dark:bg-${color}-400/10 text-${color}-500 dark:text-${color}-400`
+    class: `bg-${color}-500/10 dark:bg-${color}-400/10 text-${color}-500 dark:text-${color}-400`
   })), ...options.colors.map((color: string) => ({
     color,
     variant: 'subtle',
-    class: `bg-${color}-50 dark:bg-${color}-400/10 text-${color}-500 dark:text-${color}-400 ring ring-inset ring-${color}-500/25 dark:ring-${color}-400/25`
+    class: `bg-${color}-500/10 dark:bg-${color}-400/10 text-${color}-500 dark:text-${color}-400 ring ring-inset ring-${color}-500/25 dark:ring-${color}-400/25`
   })), {
     color: 'white',
     variant: 'solid',
diff --git a/test/components/__snapshots__/Badge.spec.ts.snap b/test/components/__snapshots__/Badge.spec.ts.snap
index b4f72e98..34c5ee8c 100644
--- a/test/components/__snapshots__/Badge.spec.ts.snap
+++ b/test/components/__snapshots__/Badge.spec.ts.snap
@@ -28,8 +28,8 @@ exports[`Badge > renders with size sm correctly 1`] = `"<span class="rounded-md
 
 exports[`Badge > renders with variant outline correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 text-primary-500 dark:text-primary-400 ring ring-inset ring-primary-500 dark:ring-primary-400">Badge</span>"`;
 
-exports[`Badge > renders with variant soft correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 bg-primary-50 dark:bg-primary-400/10 text-primary-500 dark:text-primary-400">Badge</span>"`;
+exports[`Badge > renders with variant soft correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 bg-primary-500/10 dark:bg-primary-400/10 text-primary-500 dark:text-primary-400">Badge</span>"`;
 
 exports[`Badge > renders with variant solid correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 bg-primary-500 dark:bg-primary-400 text-white dark:text-gray-900">Badge</span>"`;
 
-exports[`Badge > renders with variant subtle correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 bg-primary-50 dark:bg-primary-400/10 text-primary-500 dark:text-primary-400 ring ring-inset ring-primary-500/25 dark:ring-primary-400/25">Badge</span>"`;
+exports[`Badge > renders with variant subtle correctly 1`] = `"<span class="rounded-md font-medium inline-flex items-center text-xs px-2 py-1 bg-primary-500/10 dark:bg-primary-400/10 text-primary-500 dark:text-primary-400 ring ring-inset ring-primary-500/25 dark:ring-primary-400/25">Badge</span>"`;