diff --git a/components/chat-example-panel.tsx b/components/chat-example-panel.tsx
index f0bc446..2c48263 100644
--- a/components/chat-example-panel.tsx
+++ b/components/chat-example-panel.tsx
@@ -21,6 +21,23 @@ export default function ExamplePanel({
             console.error("Error loading example image:", error);
         }
     };
+
+    // Handler for the "Replicate this in aws style" button
+    const handleReplicateArchitecture = async () => {
+        setInput("Replicate this in aws style");
+
+        try {
+            // Fetch the architecture image
+            const response = await fetch("/architecture.png");
+            const blob = await response.blob();
+            const file = new File([blob], "architecture.png", { type: "image/png" });
+
+            // Set the file to the files state
+            setFiles([file]);
+        } catch (error) {
+            console.error("Error loading architecture image:", error);
+        }
+    };
     return (
         <div className="px-4 py-2 border-t border-b border-gray-100">
             <p className="text-sm text-gray-500 mb-2">
@@ -33,6 +50,12 @@ export default function ExamplePanel({
             </p>
             <p className="text-sm text-gray-500 mb-2">Try these examples:</p>
             <div className="flex flex-wrap gap-5">
+                <button
+                    className="text-xs bg-gray-100 hover:bg-gray-200 text-gray-800 font-medium py-1 px-2 rounded"
+                    onClick={handleReplicateArchitecture}
+                >
+                    Replicate this in aws style
+                </button>
                 <button
                     className="text-xs bg-gray-100 hover:bg-gray-200 text-gray-800 font-medium py-1 px-2 rounded"
                     onClick={handleReplicateFlowchart}
diff --git a/public/architecture.png b/public/architecture.png
new file mode 100644
index 0000000..cf66cfa
Binary files /dev/null and b/public/architecture.png differ