diff --git a/frontend/src/components/bounty/BountyGrid.tsx b/frontend/src/components/bounty/BountyGrid.tsx
new file mode 100644
index 0000000..34b4709
--- /dev/null
+++ b/frontend/src/components/bounty/BountyGrid.tsx
@@ -0,0 +1,31 @@
+'use client'
+
+import React from 'react'
+import { cn } from '@/lib/utils'
+
+interface BountyGridProps {
+  children: React.ReactNode
+  className?: string
+}
+
+/**
+ * BountyGrid - Responsive grid layout for bounty cards.
+ *
+ * Breakpoints:
+ *   - < 640px (mobile):  1 column
+ *   - ≥ 768px (tablet):  2 columns
+ *   - ≥1024px (desktop): 3 columns
+ *   - ≥1280px (wide):    4 columns
+ */
+export default function BountyGrid({ children, className }: BountyGridProps) {
+  return (
+    <div
+      className={cn(
+        'grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6',
+        className
+      )}
+    >
+      {children}
+    </div>
+  )
+}
diff --git a/frontend/src/components/bounty/index.ts b/frontend/src/components/bounty/index.ts
index 7eef398..6a79bc6 100644
--- a/frontend/src/components/bounty/index.ts
+++ b/frontend/src/components/bounty/index.ts
@@ -1,2 +1,3 @@
 export { default as BountyCard } from './BountyCard'
-export type { BountyStatus } from './BountyCard'
\ No newline at end of file
+export type { BountyStatus } from './BountyCard'
+export { default as BountyGrid } from './BountyGrid'
\ No newline at end of file