diff --git a/bun.lock b/bun.lock
index a8c7c06..01591ea 100644
--- a/bun.lock
+++ b/bun.lock
@@ -31,6 +31,8 @@
"react-dom": "19.2.1",
"react-hook-form": "^7.69.0",
"react-markdown": "^10.1.0",
+ "react-social-icons": "^6.25.0",
+ "simple-icons": "^16.2.0",
"sonner": "^2.0.7",
"tailwind-merge": "^3.4.0",
"zod": "^4.2.1",
@@ -136,6 +138,8 @@
"@aws/lambda-invoke-store": ["@aws/lambda-invoke-store@0.2.2", "", {}, "sha512-C0NBLsIqzDIae8HFw9YIrIBsbc0xTiOtt7fAukGPnqQ/+zZNaq+4jhuccltK0QuWHBnNm/a6kLIRA6GFiM10eg=="],
+ "@babel/runtime": ["@babel/runtime@7.28.4", "", {}, "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ=="],
+
"@biomejs/biome": ["@biomejs/biome@2.2.0", "", { "optionalDependencies": { "@biomejs/cli-darwin-arm64": "2.2.0", "@biomejs/cli-darwin-x64": "2.2.0", "@biomejs/cli-linux-arm64": "2.2.0", "@biomejs/cli-linux-arm64-musl": "2.2.0", "@biomejs/cli-linux-x64": "2.2.0", "@biomejs/cli-linux-x64-musl": "2.2.0", "@biomejs/cli-win32-arm64": "2.2.0", "@biomejs/cli-win32-x64": "2.2.0" }, "bin": { "biome": "bin/biome" } }, "sha512-3On3RSYLsX+n9KnoSgfoYlckYBoU6VRM22cw1gB4Y0OuUVSYd/O/2saOJMrA4HFfA1Ff0eacOvMN1yAAvHtzIw=="],
"@biomejs/cli-darwin-arm64": ["@biomejs/cli-darwin-arm64@2.2.0", "", { "os": "darwin", "cpu": "arm64" }, "sha512-zKbwUUh+9uFmWfS8IFxmVD6XwqFcENjZvEyfOxHs1epjdH3wyyMQG80FGDsmauPwS2r5kXdEM0v/+dTIA9FXAg=="],
@@ -828,6 +832,8 @@
"react-remove-scroll-bar": ["react-remove-scroll-bar@2.3.8", "", { "dependencies": { "react-style-singleton": "^2.2.2", "tslib": "^2.0.0" }, "peerDependencies": { "@types/react": "*", "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" }, "optionalPeers": ["@types/react"] }, "sha512-9r+yi9+mgU33AKcj6IbT9oRCO78WriSj6t/cF8DWBZJ9aOGPOTEDvdUDz1FwKim7QXWwmHqtdHnRJfhAxEG46Q=="],
+ "react-social-icons": ["react-social-icons@6.25.0", "", { "dependencies": { "@babel/runtime": "^7.27.0" }, "peerDependencies": { "react": "16.x.x || 17.x.x || 18.x.x || 19.x.x", "react-dom": "16.x.x || 17.x.x || 18.x.x || 19.x.x" } }, "sha512-PN9UpIb+f2u9H2t6MOoybaCD88yvQH+f9z/BILlg+n9MRzSYPtDODPzLb5dCUeyQ42eYyGDPGPIVARLWz5UEjg=="],
+
"react-style-singleton": ["react-style-singleton@2.2.3", "", { "dependencies": { "get-nonce": "^1.0.0", "tslib": "^2.0.0" }, "peerDependencies": { "@types/react": "*", "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc" }, "optionalPeers": ["@types/react"] }, "sha512-b6jSvxvVnyptAiLjbkWLE/lOnR4lfTtDAl+eUC7RZy+QQWc6wRzIV2CE6xBuMmDxc2qIihtDCZD5NPOFl7fRBQ=="],
"readdirp": ["readdirp@4.1.2", "", {}, "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg=="],
@@ -858,6 +864,8 @@
"signal-exit": ["signal-exit@4.1.0", "", {}, "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw=="],
+ "simple-icons": ["simple-icons@16.2.0", "", {}, "sha512-SCV4cAX8O2M2WQ3QJm+3k4QdcUIJiBiwKNViQiOwPjWbFWgypzelviW+Bp0A2ij6r/DIEZpTTDcLgD/BE4aexQ=="],
+
"sonner": ["sonner@2.0.7", "", { "peerDependencies": { "react": "^18.0.0 || ^19.0.0 || ^19.0.0-rc", "react-dom": "^18.0.0 || ^19.0.0 || ^19.0.0-rc" } }, "sha512-W6ZN4p58k8aDKA4XPcx2hpIQXBRAgyiWVkYhT7CvK6D3iAu7xjvVyhQHg2/iaKJZ1XVJ4r7XuwGL+WGEK37i9w=="],
"source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="],
diff --git a/package.json b/package.json
index cb9f35a..cd25dca 100644
--- a/package.json
+++ b/package.json
@@ -37,6 +37,7 @@
"react-dom": "19.2.1",
"react-hook-form": "^7.69.0",
"react-markdown": "^10.1.0",
+ "simple-icons": "^16.2.0",
"sonner": "^2.0.7",
"tailwind-merge": "^3.4.0",
"zod": "^4.2.1"
diff --git a/src/app/(normal)/page.tsx b/src/app/(normal)/page.tsx
index da82503..72de310 100644
--- a/src/app/(normal)/page.tsx
+++ b/src/app/(normal)/page.tsx
@@ -1,3 +1,4 @@
+import { SocialLinks } from "@/components/SocialLinks";
import { ArrowBigRight } from "lucide-react";
export default function Home() {
@@ -14,18 +15,9 @@ export default function Home() {
If you want to commission me
you can find all the information you need here:
Linktree
-
- {/* Search */}
- {/*
-
-
-
-
-
*/}
+
+
+
diff --git a/src/components/SocialLinks.tsx b/src/components/SocialLinks.tsx
new file mode 100644
index 0000000..f98f4b4
--- /dev/null
+++ b/src/components/SocialLinks.tsx
@@ -0,0 +1,90 @@
+import {
+ siBluesky,
+ siMastodon,
+ siPaypal,
+ siTelegram,
+ type SimpleIcon,
+} from "simple-icons";
+
+type SocialKey = "paypal" | "telegram" | "mastodon" | "bluesky";
+
+const SOCIALS: Record<
+ SocialKey,
+ { label: string; icon: SimpleIcon; href: string }
+> = {
+ paypal: {
+ label: "PayPal",
+ icon: siPaypal,
+ href: "https://paypal.me/Gaertan",
+ },
+ telegram: {
+ label: "Telegram",
+ icon: siTelegram,
+ href: "https://t.me/Gaertan",
+ },
+ mastodon: {
+ label: "Mastodon",
+ icon: siMastodon,
+ href: "https://mastodon.social/@Gaertan",
+ },
+ bluesky: {
+ label: "Bluesky",
+ icon: siBluesky,
+ href: "https://bsky.app/profile/gaertan.bsky.social",
+ },
+};
+
+function BrandSvg({ icon }: { icon: SimpleIcon }) {
+ // Simple Icons SVGs are typically 24x24 viewBox.
+ return (
+
+ );
+}
+
+export function SocialLinks({
+ items = ["paypal", "telegram", "mastodon", "bluesky"],
+ size = "md",
+}: {
+ items?: SocialKey[];
+ size?: "sm" | "md" | "lg";
+}) {
+ const sizeClass =
+ size === "sm" ? "h-9 w-9" : size === "lg" ? "h-12 w-12" : "h-10 w-10";
+
+ return (
+
+ {items.map((key) => {
+ const s = SOCIALS[key];
+
+ return (
+
+
+ {s.label}
+
+ );
+ })}
+