diff --git a/next.config.js b/next.config.js
new file mode 100644
index 0000000..76545d2
--- /dev/null
+++ b/next.config.js
@@ -0,0 +1,27 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  images: {
+    remotePatterns: [
+      { protocol: 'https', hostname: 'images.pexels.com' },
+      { protocol: 'https', hostname: 'images.unsplash.com' },
+      // Supabase storage — user-uploaded images via the Replace Image chip
+      { protocol: 'https', hostname: '**.supabase.co' },
+      // Medusa product images served from local dev backend
+      { protocol: 'http', hostname: 'localhost' },
+      { protocol: 'https', hostname: 'localhost' },
+    ],
+  },
+  // Allow Vula IDE to embed this preview in an iframe during local development.
+  // In production the IDE proxies the preview through the same origin,
+  // so this header is only relevant in the sandbox dev environment.
+  async headers() {
+    return [
+      {
+        source: '/(.*)',
+        headers: [{ key: 'X-Frame-Options', value: 'ALLOWALL' }],
+      },
+    ]
+  },
+}
+
+module.exports = nextConfig