diff --git a/package.json b/package.json
index 04803da..bfb592a 100755
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "astroplate",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "Astro and Tailwindcss boilerplate",
   "author": "zeon.studio",
   "license": "MIT",
diff --git a/src/content/pages/elements.mdx b/src/content/pages/elements.mdx
index f1265d8..fa23af2 100755
--- a/src/content/pages/elements.mdx
+++ b/src/content/pages/elements.mdx
@@ -134,7 +134,7 @@ window.addEventListener("load", (e) => {
 
 ### Button
 
-<Button href="#" style="solid">Button</Button>
+<Button label="Button" link="#" style="solid"/>
 
 ---
 
diff --git a/src/layouts/shortcodes/Button.tsx b/src/layouts/shortcodes/Button.tsx
index 58edd6a..e8e18b3 100755
--- a/src/layouts/shortcodes/Button.tsx
+++ b/src/layouts/shortcodes/Button.tsx
@@ -1,19 +1,19 @@
 import React from "react";
 
 const Button = ({
-  href,
+  label,
+  link,
   style,
   rel,
-  children,
 }: {
-  href: string;
-  style: string | null;
-  rel: string | null;
-  children: string;
+  label: string;
+  link: string;
+  style?: string;
+  rel?: string;
 }) => {
   return (
     <a
-      href={href}
+      href={link}
       target="_blank"
       rel={`noopener noreferrer ${
         rel ? (rel === "follow" ? "" : rel) : "nofollow"
@@ -22,7 +22,7 @@ const Button = ({
         style === "outline" ? "btn-outline-primary" : "btn-primary"
       }`}
     >
-      {children}
+      {label}
     </a>
   );
 };