diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
new file mode 100644
index 0000000..04b6a9c
--- /dev/null
+++ b/src/app/checkout/page.tsx
@@ -0,0 +1,50 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+
+export default function CheckoutPage() {
+    return (
+        <ThemeProvider
+            defaultButtonVariant="hover-bubble"
+            defaultTextAnimation="reveal-blur"
+            borderRadius="rounded"
+            contentWidth="small"
+            sizing="largeSmallSizeLargeTitles"
+            background="aurora"
+            cardStyle="gradient-bordered"
+            primaryButtonStyle="double-inset"
+            secondaryButtonStyle="solid"
+            headingFontWeight="extrabold"
+        >
+            <NavbarStyleCentered
+                brandName="Luminé Skincare"
+                navItems={[
+                    { name: "Products", id: "/" },
+                    { name: "About", id: "/" },
+                    { name: "Benefits", id: "/" },
+                    { name: "Cart", id: "/cart" },
+                    { name: "Checkout", id: "/checkout" }
+                ]}
+            />
+            <main className="container mx-auto py-20">
+                <h1 className="text-4xl font-bold mb-8">Checkout</h1>
+                <div className="grid grid-cols-1 md:grid-cols-2 gap-12">
+                    <div className="p-8 bg-card rounded-lg border">
+                        <h2 className="text-2xl mb-4 font-semibold">Shipping Information</h2>
+                        <div className="space-y-4">
+                            <input type="text" placeholder="Full Name" className="w-full p-3 border rounded" />
+                            <input type="email" placeholder="Email Address" className="w-full p-3 border rounded" />
+                        </div>
+                    </div>
+                    <div className="p-8 bg-card rounded-lg border">
+                        <h2 className="text-2xl mb-4 font-semibold">Order Summary</h2>
+                        <div className="border-t pt-4 mt-4">
+                            <p className="text-lg font-bold">Total: $0.00</p>
+                        </div>
+                    </div>
+                </div>
+            </main>
+        </ThemeProvider>
+    );
+}
\ No newline at end of file