diff --git a/daily-thought-frontend/src/components/post/AnswerCard.tsx b/daily-thought-frontend/src/components/post/AnswerCard.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e816fb20e2e8c044fd9ad00bff0a386c66491844
--- /dev/null
+++ b/daily-thought-frontend/src/components/post/AnswerCard.tsx
@@ -0,0 +1,55 @@
+import { Post } from "@/types/post"
+import { FC, PropsWithChildren } from "react"
+import { Bars3Icon, HeartIcon, ChatBubbleLeftIcon } from '@heroicons/react/24/outline'
+import LikeStack from "./LikeStack"
+import Comment from "../comments/Comment"
+
+type AnswerCardProps = {
+  post: Post;
+  commentLimit: number;
+}
+
+const AnswerCard: FC<PropsWithChildren<AnswerCardProps>> = ({
+  post,
+  commentLimit
+}) => {
+
+  return (
+    <div className="flex-1 rounded-3xl bg-white text-lg shadow-lg overflow-hidden">
+      <div className="p-4">
+        <p className="text-sm text-gray-600">{`${post.User.Name}'s answer`}</p>
+        <div>
+          This is my super duper answer. My name is Timmy C and I enjoy smooth jazz.
+        </div>
+        <div className="mt-2 flex ">
+          <div className="flex-1">
+            <button
+              type="button"
+              className="ml-auto mr-2 flex-shrink-0 rounded-full bg-white p-1 text-c-pink hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-c-pink"
+            >
+              <span className="sr-only">View notifications</span>
+              <HeartIcon className="h-6 w-6" aria-hidden="true"/>
+            </button>
+            <button
+              type="button"
+              className="ml-auto mr-2 flex-shrink-0 rounded-full bg-white p-1 text-c-pink hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-c-pink"
+            >
+              <span className="sr-only">View notifications</span>
+              <ChatBubbleLeftIcon className="h-6 w-6" aria-hidden="true"/>
+            </button>
+          </div>
+          <LikeStack Users={[]} />
+        </div>
+      </div>
+    
+    
+
+    <div className="border-t bg-gray-50 p-2">
+      <p className="text-xs text-gray-500 hover:text-c-pink">View all 3 comments</p>
+      <Comment Comment={{Data: "asdfg", User: post.User}} />
+    </div>
+  </div>
+  )
+}
+
+export default AnswerCard
\ No newline at end of file