diff --git a/app/posts/[slug]/page.tsx b/app/posts/[slug]/page.tsx
index 4415b77..6320671 100644
--- a/app/posts/[slug]/page.tsx
+++ b/app/posts/[slug]/page.tsx
@@ -7,6 +7,7 @@ import { MDXRemote } from "next-mdx-remote/rsc";
 import rehypePrettyCode from "rehype-pretty-code";
 import rehypeSlug from "rehype-slug";
 import remarkGfm from "remark-gfm";
+import Video from "@/components/video";
 
 interface PageProps {
   params: Promise<{ slug: string }>;
@@ -63,6 +64,7 @@ export default async function Post({ params }: PageProps) {
             <div className="prose lg:prose-lg max-w-none">
               <MDXRemote
                 source={postData.content}
+                components={{ Video }}
                 options={{
                   mdxOptions: {
                     remarkPlugins: [remarkGfm],