diff --git a/src/components/Card.tsx b/src/components/Card.tsx
deleted file mode 100644
index 053cbae..0000000
--- a/src/components/Card.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import { type BoxProps, type VariantProps, createRestyleComponent } from "@shopify/restyle";
-import type { Theme } from "@themes/Theme";
-import { cardVariants } from "@themes/Variants";
-import Box from "./bases/Box";
-
-const Card = createRestyleComponent<
-	VariantProps<Theme, "cardVariants"> &
-		BoxProps<Theme> & {
-			children: React.ReactNode;
-		},
-	Theme
->([cardVariants], Box);
-
-export default Card;
diff --git a/src/components/bases/Card.tsx b/src/components/bases/Card.tsx
new file mode 100644
index 0000000..7393772
--- /dev/null
+++ b/src/components/bases/Card.tsx
@@ -0,0 +1,23 @@
+import type { Theme } from "@/themes/Theme";
+import Box from "@re-box";
+import { type VariantProps, createRestyleComponent, createVariant } from "@shopify/restyle";
+
+const Card = createRestyleComponent<
+	VariantProps<Theme, "cardVariants"> & React.ComponentProps<typeof Box>,
+	Theme
+>(
+	[
+		createVariant({
+			themeKey: "cardVariants",
+			defaults: {
+				margin: {
+					phone: "s",
+					tablet: "m",
+				},
+				backgroundColor: "red",
+			},
+		}),
+	],
+	Box,
+);
+export default Card;