diff --git a/__tests__/components/button.spec.tsx b/__tests__/components/button.spec.tsx
new file mode 100644
index 0000000..257a8e3
--- /dev/null
+++ b/__tests__/components/button.spec.tsx
@@ -0,0 +1,58 @@
+import { render, screen } from "@testing-library/react"
+
+import { Button } from "@/components/Button/Button"
+
+describe("Button component", () => {
+  it("renders with default intent and size", () => {
+    render(<Button href="/">Default Button</Button>)
+    const btn = screen.getByRole("link", { name: /default button/i })
+    expect(btn).toBeInTheDocument()
+    expect(btn).toHaveClass("bg-blue-400")
+    expect(btn).toHaveClass("text-lg")
+  })
+
+  it("renders secondary intent correctly", () => {
+    render(<Button href="/" intent="secondary">Secondary Button</Button>)
+    const btn = screen.getByRole("link", { name: /secondary button/i })
+    expect(btn).toHaveClass("bg-transparent")
+    expect(btn).toHaveClass("text-blue-400")
+  })
+
+  it("renders small size correctly", () => {
+    render(<Button href="/" size="sm">Small Button</Button>)
+    const btn = screen.getByRole("link", { name: /small button/i })
+    expect(btn).toHaveClass("text-sm")
+    expect(btn).toHaveClass("min-w-20")
+  })
+
+  it("applies underline when underline prop is true", () => {
+    render(<Button href="/" underline>Underlined Button</Button>)
+    const btn = screen.getByRole("link", { name: /underlined button/i })
+    expect(btn).toHaveClass("underline")
+  })
+
+  it("does not apply underline class when underline prop is false or omitted", () => {
+    render(<Button href="/">No Underline</Button>)
+    const btn = screen.getByRole("link", { name: /no underline/i })
+    expect(btn).not.toHaveClass("underline")
+  })
+
+  it("merges custom className with variant classes", () => {
+    render(<Button href="/" className="custom-class">Custom Class Button</Button>)
+    const btn = screen.getByRole("link", { name: /custom class button/i })
+    expect(btn).toHaveClass("custom-class")
+    expect(btn).toHaveClass("bg-blue-400")
+  })
+
+  it("forwards href and other props correctly", () => {
+    render(<Button href="/test" rel="noopener noreferrer">Link Button</Button>)
+    const btn = screen.getByRole("link", { name: /link button/i })
+    expect(btn).toHaveAttribute("href", "/test")
+    expect(btn).toHaveAttribute("rel", "noopener noreferrer")
+  })
+
+  it("renders children inside the anchor tag", () => {
+    render(<Button href="/">Click Me</Button>)
+    expect(screen.getByText("Click Me")).toBeInTheDocument()
+  })
+})