diff --git a/packages/status-react/src/system/button/button.tsx b/packages/status-react/src/system/button/button.tsx
index 5441c4af..2c87df4a 100644
--- a/packages/status-react/src/system/button/button.tsx
+++ b/packages/status-react/src/system/button/button.tsx
@@ -14,6 +14,7 @@ interface Props {
   type?: ButtonProps['type']
   onClick?: ButtonProps['onClick']
   variant?: Variants['variant']
+  size?: Variants['size']
 }
 
 const Button = (props: Props, ref: Ref<HTMLButtonElement>) => {
diff --git a/packages/status-react/src/system/button/styles.tsx b/packages/status-react/src/system/button/styles.tsx
index cf81f3b0..6a7d326f 100644
--- a/packages/status-react/src/system/button/styles.tsx
+++ b/packages/status-react/src/system/button/styles.tsx
@@ -9,11 +9,12 @@ export const Base = styled('button', {
   fontFamily: '$sans',
   fontWeight: '$500',
   fontSize: '15px',
+  lineHeight: 1.4,
   position: 'relative',
   display: 'inline-flex',
   justifyContent: 'center',
   alignItems: 'center',
-  padding: '11px 24px',
+  padding: '12px 24px',
   borderRadius: '$8',
   transitionProperty: 'background-color, border-color, color, fill, stroke',
   transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
@@ -52,6 +53,12 @@ export const Base = styled('button', {
         },
       },
     },
+    size: {
+      small: {
+        fontSize: '13px',
+        padding: '10px 12px',
+      },
+    },
     loading: {
       true: {},
     },