diff --git a/frontend/public/bg-cozy-room.png b/frontend/public/bg-cozy-room.png
new file mode 100644
index 0000000..988e157
Binary files /dev/null and b/frontend/public/bg-cozy-room.png differ
diff --git a/frontend/public/bg-garden.png b/frontend/public/bg-garden.png
new file mode 100644
index 0000000..46aa30e
Binary files /dev/null and b/frontend/public/bg-garden.png differ
diff --git a/frontend/public/bg-rainy-window.png b/frontend/public/bg-rainy-window.png
new file mode 100644
index 0000000..011096f
Binary files /dev/null and b/frontend/public/bg-rainy-window.png differ
diff --git a/frontend/public/bg-rooftop-cafe.png b/frontend/public/bg-rooftop-cafe.png
new file mode 100644
index 0000000..a4cd8fa
Binary files /dev/null and b/frontend/public/bg-rooftop-cafe.png differ
diff --git a/frontend/public/bg-stargazing.png b/frontend/public/bg-stargazing.png
new file mode 100644
index 0000000..f0c7de8
Binary files /dev/null and b/frontend/public/bg-stargazing.png differ
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 4b00688..8688001 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -96,6 +96,15 @@ export default function App() {
 
   return (
     <div className="h-screen relative transition-all duration-1000" style={{ background: currentScene.gradient }}>
+      {/* Scene background image (when available) */}
+      {currentScene.image && (
+        <img
+          src={currentScene.image}
+          alt=""
+          className="absolute inset-0 w-full h-full object-cover transition-opacity duration-1000"
+          style={{ zIndex: 0 }}
+        />
+      )}
       {/* Single Live2D canvas: both Kira and Mochi share one WebGL context */}
       <Live2DStage
         onKiraReady={(model) => { kiraModelRef.current = model; }}
diff --git a/frontend/src/components/scenes.ts b/frontend/src/components/scenes.ts
index 93887cc..bd2acb7 100644
--- a/frontend/src/components/scenes.ts
+++ b/frontend/src/components/scenes.ts
@@ -2,19 +2,20 @@ export interface Scene {
   id: string;
   name: string;
   gradient: string;
+  image?: string;
   particles?: 'rain' | 'stars' | 'petals' | 'snow' | 'none';
   icon: string;
 }
 
 export const SCENES: Scene[] = [
-  { id: 'cozy-room', name: 'Cozy Room', gradient: 'linear-gradient(135deg, #FFF5F5 0%, #FFE4E1 40%, #FFDAB9 100%)', icon: '🏠' },
-  { id: 'coffee-shop', name: 'Coffee Shop', gradient: 'linear-gradient(135deg, #F5E6D3 0%, #E8D5C4 40%, #D4A574 100%)', icon: '☕' },
-  { id: 'garden', name: 'Garden', gradient: 'linear-gradient(135deg, #F0FFF4 0%, #C6F6D5 40%, #9AE6B4 100%)', icon: '🌿' },
-  { id: 'rainy-window', name: 'Rainy Window', gradient: 'linear-gradient(135deg, #E2E8F0 0%, #CBD5E0 40%, #A0AEC0 100%)', icon: '🌧️' },
-  { id: 'starry-night', name: 'Starry Night', gradient: 'linear-gradient(135deg, #1A1A2E 0%, #16213E 40%, #0F3460 100%)', icon: '🌙' },
-  { id: 'sakura', name: 'Sakura Spring', gradient: 'linear-gradient(135deg, #FFF0F5 0%, #FFB6C1 30%, #FF69B4 100%)', icon: '🌸' },
+  { id: 'cozy-room', name: 'Cozy Room', gradient: 'linear-gradient(135deg, #FFF5F5 0%, #FFE4E1 40%, #FFDAB9 100%)', image: '/bg-cozy-room.png', icon: '🏠' },
+  { id: 'coffee-shop', name: 'Coffee Shop', gradient: 'linear-gradient(135deg, #F5E6D3 0%, #E8D5C4 40%, #D4A574 100%)', image: '/bg-rooftop-cafe.png', icon: '☕' },
+  { id: 'garden', name: 'Garden', gradient: 'linear-gradient(135deg, #F0FFF4 0%, #C6F6D5 40%, #9AE6B4 100%)', image: '/bg-garden.png', icon: '🌿' },
+  { id: 'rainy-window', name: 'Rainy Window', gradient: 'linear-gradient(135deg, #E2E8F0 0%, #CBD5E0 40%, #A0AEC0 100%)', image: '/bg-rainy-window.png', particles: 'rain', icon: '🌧️' },
+  { id: 'starry-night', name: 'Starry Night', gradient: 'linear-gradient(135deg, #1A1A2E 0%, #16213E 40%, #0F3460 100%)', image: '/bg-stargazing.png', particles: 'stars', icon: '🌙' },
+  { id: 'sakura', name: 'Sakura Spring', gradient: 'linear-gradient(135deg, #FFF0F5 0%, #FFB6C1 30%, #FF69B4 100%)', particles: 'petals', icon: '🌸' },
   { id: 'ocean', name: 'Ocean View', gradient: 'linear-gradient(135deg, #E0F7FA 0%, #B2EBF2 40%, #4DD0E1 100%)', icon: '🌊' },
-  { id: 'autumn', name: 'Autumn Library', gradient: 'linear-gradient(135deg, #FFF8E1 0%, #FFE0B2 40%, #FFCC80 100%)', icon: '🍂' },
-  { id: 'winter-cabin', name: 'Winter Cabin', gradient: 'linear-gradient(135deg, #EDF2F7 0%, #E2E8F0 40%, #CBD5E0 100%)', icon: '❄️' },
+  { id: 'autumn', name: 'Autumn Library', gradient: 'linear-gradient(135deg, #FFF8E1 0%, #FFE0B2 40%, #FFCC80 100%)', particles: 'petals', icon: '🍂' },
+  { id: 'winter-cabin', name: 'Winter Cabin', gradient: 'linear-gradient(135deg, #EDF2F7 0%, #E2E8F0 40%, #CBD5E0 100%)', particles: 'snow', icon: '❄️' },
   { id: 'sunset', name: 'Sunset Beach', gradient: 'linear-gradient(135deg, #FFF5F5 0%, #FED7E2 30%, #F687B3 60%, #D53F8C 100%)', icon: '🌅' },
 ];