diff --git a/components/icons.tsx b/components/icons.tsx
index 93769ace6d9b2266d367ff5871275e0f177c501d..ca3cca6a684a943b5bedb3e5fbcd5d6d6ede68d4 100644
--- a/components/icons.tsx
+++ b/components/icons.tsx
@@ -10,6 +10,7 @@ import {
     File,
     FileText,
     Gamepad2,
+    Heart,
     HelpCircle,
     Home,
     Image,
@@ -70,6 +71,7 @@ export const Icons: IconsType = {
     sun: SunMedium, // Light Mode Toggle Nav
     moon: Moon, // Dark Mode Toggle Nav
     arrowdown: ArrowDown, // Descending Sort
+    heart: Heart, // Like Button
     close: X,
     spinner: Loader2,
     chevronLeft: ChevronLeft,
diff --git a/components/like-button.tsx b/components/like-button.tsx
index b0035aa6d0f90da8e5692c417626a8a7277a073a..1cbe75577ad694e63549e416bf1b1e72f2783f38 100644
--- a/components/like-button.tsx
+++ b/components/like-button.tsx
@@ -3,6 +3,8 @@
 import { Prisma } from "@prisma/client";
 import { useRouter } from "next/navigation";
 import { startTransition } from "react";
+import { Icons } from "./icons";
+import { Button } from "./ui/button";
 
 type likeType = Prisma.LikeUncheckedCreateInput
 
@@ -32,9 +34,9 @@ export default function LikeButton(props: { data: likeType }) {
   return (
     <div>
       <form onSubmit={postLike}>
-        <button type="submit" className="mt-2 bg-gray-300 text-gray-800 px-4 py-2 rounded float-right">
-          Like
-        </button>
+        <Button type="submit" variant="ghost" size="lg" className="float-right" >
+          <Icons.heart className="h-3 w-3" />
+        </Button>
       </form>
     </div>
   )