diff --git a/apps/govquests-frontend/src/domains/questing/components/BadgeCard.tsx b/apps/govquests-frontend/src/domains/gamification/components/BadgeCard.tsx
similarity index 92%
rename from apps/govquests-frontend/src/domains/questing/components/BadgeCard.tsx
rename to apps/govquests-frontend/src/domains/gamification/components/BadgeCard.tsx
index 3bc8f4dd..7861ead3 100644
--- a/apps/govquests-frontend/src/domains/questing/components/BadgeCard.tsx
+++ b/apps/govquests-frontend/src/domains/gamification/components/BadgeCard.tsx
@@ -1,7 +1,7 @@
 import { cn } from "@/lib/utils";
 import Image from "next/image";
 import Link from "next/link";
-import { useFetchBadge } from "../hooks/useFetchBadge";
+import { useFetchBadge } from "../../questing/hooks/useFetchBadge";
 
 interface BadgeCardProps {
   badgeId: string;
diff --git a/apps/govquests-frontend/src/domains/gamification/graphql/badgeQuery.ts b/apps/govquests-frontend/src/domains/gamification/graphql/badgeQuery.ts
new file mode 100644
index 00000000..945bd5c2
--- /dev/null
+++ b/apps/govquests-frontend/src/domains/gamification/graphql/badgeQuery.ts
@@ -0,0 +1,14 @@
+import { graphql } from "gql.tada";
+
+export const BadgeQuery = graphql(`
+  query GetBadge($id: ID!) {
+    badge(id: $id) {
+      id
+      displayData {
+        title
+        description
+        imageUrl
+      }
+    }
+  }
+`);
diff --git a/apps/govquests-frontend/src/domains/gamification/hooks/useFetchBadge.ts b/apps/govquests-frontend/src/domains/gamification/hooks/useFetchBadge.ts
new file mode 100644
index 00000000..4206a45d
--- /dev/null
+++ b/apps/govquests-frontend/src/domains/gamification/hooks/useFetchBadge.ts
@@ -0,0 +1,12 @@
+"use client";
+
+import { useQuery } from "@tanstack/react-query";
+import { fetchBadge } from "../services/badgeService";
+
+export const useFetchBadge = (id: string) => {
+  return useQuery({
+    queryKey: ["badge", id],
+    queryFn: () => fetchBadge(id),
+    enabled: !!id,
+  });
+};
diff --git a/apps/govquests-frontend/src/domains/gamification/services/badgeService.ts b/apps/govquests-frontend/src/domains/gamification/services/badgeService.ts
new file mode 100644
index 00000000..8e6e49f7
--- /dev/null
+++ b/apps/govquests-frontend/src/domains/gamification/services/badgeService.ts
@@ -0,0 +1,7 @@
+import { API_URL } from "@/lib/utils";
+import request from "graphql-request";
+import { BadgeQuery } from "../graphql/badgeQuery";
+
+export const fetchBadge = async (id: string) => {
+  return await request(API_URL, BadgeQuery, { id });
+};
diff --git a/apps/govquests-frontend/src/domains/gamification/types/badgeTypes.ts b/apps/govquests-frontend/src/domains/gamification/types/badgeTypes.ts
new file mode 100644
index 00000000..df4c0d88
--- /dev/null
+++ b/apps/govquests-frontend/src/domains/gamification/types/badgeTypes.ts
@@ -0,0 +1,4 @@
+import { ResultOf } from "gql.tada";
+import { BadgeQuery } from "../graphql/badgeQuery";
+
+export type Badge = ResultOf<typeof BadgeQuery>["badge"];
diff --git a/apps/govquests-frontend/src/domains/questing/components/QuestDetails.tsx b/apps/govquests-frontend/src/domains/questing/components/QuestDetails.tsx
index 19e41c4b..b5d10ac2 100644
--- a/apps/govquests-frontend/src/domains/questing/components/QuestDetails.tsx
+++ b/apps/govquests-frontend/src/domains/questing/components/QuestDetails.tsx
@@ -5,7 +5,7 @@ import type { Quest } from "@/domains/questing/types/questTypes";
 import { ArrowLeft } from "lucide-react";
 import { redirect } from "next/navigation";
 import QuestContentSection from "./QuestContentSection";
-import { BadgeCard } from "./BadgeCard";
+import { BadgeCard } from "../../gamification/components/BadgeCard";
 import HtmlRender from "@/components/ui/HtmlRender";
 import { IndicatorPill } from "@/components/IndicatorPill";
 import RewardIndicator from "@/components/RewardIndicator";
diff --git a/apps/govquests-frontend/src/domains/questing/components/track/TrackDescription.tsx b/apps/govquests-frontend/src/domains/questing/components/track/TrackDescription.tsx
index f23f75c4..2652b3d3 100644
--- a/apps/govquests-frontend/src/domains/questing/components/track/TrackDescription.tsx
+++ b/apps/govquests-frontend/src/domains/questing/components/track/TrackDescription.tsx
@@ -1,4 +1,4 @@
-import { BadgeCard } from "../BadgeCard";
+import { BadgeCard } from "../../../gamification/components/BadgeCard";
 import { Tracks } from "../../types/trackTypes";
 
 interface TrackDescriptionProps {