diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 57eed1f..c7cc53a 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,11 +1,17 @@
-import Card from "./components/Card"
-
+import Card from "./components/Card";
+import { Surface } from "@heroui/react";
 
 function App() {
-
   return (
-    <><Card /></>
-  )
+    <>
+      <Surface
+        className="flex min-w-[320px] flex-col gap-3 rounded-3xl p-6"
+        variant="default"
+      >
+        <Card />
+      </Surface>
+    </>
+  );
 }
 
-export default App
+export default App;