diff --git a/src/theme/components/button.ts b/src/theme/components/button.ts
new file mode 100644
index 00000000..ebe28a7e
--- /dev/null
+++ b/src/theme/components/button.ts
@@ -0,0 +1,26 @@
+import { defineStyleConfig } from '@chakra-ui/react';
+
+const Button = defineStyleConfig({
+  sizes: {
+    icon_sm: {
+      fontSize: 'xl',
+      h: '24px',
+      w: '24px',
+      borderRadius: 'full',
+    },
+    icon_md: {
+      fontSize: '2xl',
+      h: '38px',
+      w: '38px',
+      borderRadius: 'full',
+    },
+    icon_lg: {
+      fontSize: '3xl',
+      h: '68px',
+      w: '68px',
+      borderRadius: 'full',
+    },
+  },
+});
+
+export default Button;
diff --git a/src/theme/components/index.ts b/src/theme/components/index.ts
index 9165099f..0843c37d 100644
--- a/src/theme/components/index.ts
+++ b/src/theme/components/index.ts
@@ -1,3 +1,7 @@
-const components = {};
+import Button from './button';
+
+const components = {
+  Button,
+};
 
 export default components;