diff --git a/app/components/QuickLink.tsx b/app/components/QuickLink.tsx
deleted file mode 100644
index 3b04907..0000000
--- a/app/components/QuickLink.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import type { IconProps } from "./Icon";
-
-import { Icon } from "./Icon";
-import { Link } from "./Link";
-
-type QuickLinkProps = {
-	title: string;
-	description: string;
-	href: string;
-	icon: IconProps["icon"];
-};
-
-export default function QuickLink(props: QuickLinkProps) {
-	return (
-		<div class="group relative rounded-xl border border-slate-200">
-			<div class="absolute -inset-px rounded-xl border-2 border-transparent opacity-0 [background:linear-gradient(var(--quick-links-hover-bg,var(--color-violet-50)),var(--quick-links-hover-bg,var(--color-violet-50)))_padding-box,linear-gradient(to_top,var(--color-indigo-400),var(--color-cyan-400),var(--color-violet-500))_border-box] group-hover:opacity-100" />
-			<div class="relative overflow-hidden rounded-xl p-6">
-				<Icon icon={props.icon} color="blue" class="h-8 w-8" />
-
-				<h2 class="mt-4 font-display text-base text-slate-900">
-					<Link href={props.href}>
-						<span class="absolute -inset-px rounded-xl" />
-						{props.title}
-					</Link>
-				</h2>
-
-				<p class="mt-1 text-sm text-slate-700">{props.description}</p>
-			</div>
-		</div>
-	);
-}
diff --git a/app/components/QuickLinks.tsx b/app/components/QuickLinks.tsx
index a054189..b2b46e0 100644
--- a/app/components/QuickLinks.tsx
+++ b/app/components/QuickLinks.tsx
@@ -1,4 +1,8 @@
 import type { JSXElement } from "solid-js";
+import type { IconProps } from "./Icon";
+
+import { Icon } from "./Icon";
+import { Link } from "./Link";
 
 type QuickLinksProps = {
 	children: JSXElement;
@@ -11,3 +15,28 @@ export default function QuickLinks(props: QuickLinksProps) {
 		</div>
 	);
 }
+
+type QuickLinkProps = {
+	title: string;
+	description: string;
+	href: string;
+	icon: IconProps["icon"];
+};
+
+QuickLinks.QuickLink = (props: QuickLinkProps) => (
+	<div class="group relative rounded-xl border border-slate-200">
+		<div class="absolute -inset-px rounded-xl border-2 border-transparent opacity-0 [background:linear-gradient(var(--quick-links-hover-bg,var(--color-violet-50)),var(--quick-links-hover-bg,var(--color-violet-50)))_padding-box,linear-gradient(to_top,var(--color-indigo-400),var(--color-cyan-400),var(--color-violet-500))_border-box] group-hover:opacity-100" />
+		<div class="relative overflow-hidden rounded-xl p-6">
+			<Icon icon={props.icon} color="blue" class="h-8 w-8" />
+
+			<h2 class="mt-4 font-display text-base text-slate-900">
+				<Link href={props.href}>
+					<span class="absolute -inset-px rounded-xl" />
+					{props.title}
+				</Link>
+			</h2>
+
+			<p class="mt-1 text-sm text-slate-700">{props.description}</p>
+		</div>
+	</div>
+);
diff --git a/app/pages/docs/+Page.mdx b/app/pages/docs/+Page.mdx
index 0445a93..6307cd7 100644
--- a/app/pages/docs/+Page.mdx
+++ b/app/pages/docs/+Page.mdx
@@ -5,12 +5,11 @@ tags: []
 ---
 
 import QuickLinks from "@/components/QuickLinks";
-import QuickLink from "@/components/QuickLink";
 
 ## Documentations rédigées
 
 <QuickLinks>
-  <QuickLink
+  <QuickLinks.QuickLink
     title="React"
     description="Introduction et synthèse de la bibliothèque React"
     href="/docs/react"
@@ -21,7 +20,7 @@ import QuickLink from "@/components/QuickLink";
 ## Documentations en cours de rédaction
 
 <QuickLinks>
-  <QuickLink
+  <QuickLinks.QuickLink
     title="Merise"
     description="Introduction et synthèse de la méthode Merise"
     href="/docs/merise"