diff --git a/apps/www/src/content/docs/components/badge/index.mdx b/apps/www/src/content/docs/components/badge/index.mdx
index 0033cad1f..b5570db7d 100644
--- a/apps/www/src/content/docs/components/badge/index.mdx
+++ b/apps/www/src/content/docs/components/badge/index.mdx
@@ -36,7 +36,7 @@ Choose between different variants to convey different meanings or importance lev
 
 ### Size
 
-Three sizes. `regular` is the default; `small` and `micro` fit inside table rows and beside dense labels.
+Three sizes. `small` is the default. `regular` matches body text and suits badges that stand alone, for example beside a heading. `micro` fits inside table rows and beside dense labels.
 
 <Demo data={sizesDemo} />
 
diff --git a/packages/raystack/components/badge/badge.tsx b/packages/raystack/components/badge/badge.tsx
index 5d937c8f6..742bb21aa 100644
--- a/packages/raystack/components/badge/badge.tsx
+++ b/packages/raystack/components/badge/badge.tsx
@@ -19,25 +19,23 @@ const badge = cva(styles['badge'], {
       micro: styles['badge-micro'],
       small: styles['badge-small'],
       regular: styles['badge-regular']
-    },
-    defaultVariants: {
-      variant: 'accent',
-      size: 'small'
     }
+  },
+  defaultVariants: {
+    variant: 'accent',
+    size: 'small'
   }
 });
 
 type BadgeProps = VariantProps<typeof badge> &
   ComponentProps<'span'> & {
     icon?: ReactNode;
-    children: ReactNode;
-    className?: string;
     screenReaderText?: string;
   };
 
 export const Badge = ({
-  variant = 'accent',
-  size = 'small',
+  variant,
+  size,
   radius,
   icon,
   children,