diff --git a/senju/main.py b/senju/main.py
index 15b232e..9f782a8 100644
--- a/senju/main.py
+++ b/senju/main.py
@@ -45,3 +45,10 @@ def prompt_view():
         "prompt.html",
         title="Haiku generation"
     )
+
+@app.route("/scan")
+def scan_view():
+    return render_template(
+        "scan.html",
+        title="Image scanning"
+    )
diff --git a/senju/templates/base.html b/senju/templates/base.html
index fa78de1..070a240 100644
--- a/senju/templates/base.html
+++ b/senju/templates/base.html
@@ -43,6 +43,11 @@
    {% if request.endpoint == 'prompt_view' %} bg-gray-900 text-white {% else %} text-gray-300 hover:bg-gray-700 hover:text-white {% endif %}">
 									Haiku generation
 								</a>
+								<a href="{{ url_for('scan_view') }}"
+									class="rounded-md px-3 py-2 text-sm font-medium
+   {% if request.endpoint == 'scan_view' %} bg-gray-900 text-white {% else %} text-gray-300 hover:bg-gray-700 hover:text-white {% endif %}">
+									Image scanning
+								</a>
 								<a href="#"
 									class="rounded-md px-3 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 hover:text-white">
 									Information
diff --git a/senju/templates/scan.html b/senju/templates/scan.html
new file mode 100644
index 0000000..65f7bfd
--- /dev/null
+++ b/senju/templates/scan.html
@@ -0,0 +1,107 @@
+{% extends "base.html" %}
+
+{% block content %}
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Image Upload with Preview</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+</head>
+<body>
+    <div class="flex flex-col items-center justify-center min-h-screen bg-violet-900 text-white p-6">
+        <div class="bg-white text-gray-900 p-8 rounded-xl shadow-lg max-w-lg w-full text-center transform transition duration-300 hover:scale-105 mb-8">
+            <h1 class="text-3xl font-bold text-violet-700 mb-4">Upload your image</h1>
+            <!-- File upload container -->
+            <div id="upload-area" class="flex items-center justify-center w-full">
+                <label for="dropzone-file" class="flex flex-col items-center justify-center w-full h-64 border-2 border-gray-300 border-dashed rounded-lg cursor-pointer bg-gray-50 dark:hover:bg-gray-800 dark:bg-gray-700 hover:bg-gray-100 dark:border-gray-600 dark:hover:border-gray-500 dark:hover:bg-gray-600">
+                    <div class="flex flex-col items-center justify-center pt-5 pb-6">
+                        <svg class="w-8 h-8 mb-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 16">
+                            <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 13h3a3 3 0 0 0 0-6h-.025A5.56 5.56 0 0 0 16 6.5 5.5 5.5 0 0 0 5.207 5.021C5.137 5.017 5.071 5 5 5a4 4 0 0 0 0 8h2.167M10 15V6m0 0L8 8m2-2 2 2"/>
+                        </svg>
+                        <p class="mb-2 text-sm text-gray-500 dark:text-gray-400"><span class="font-semibold">Click to upload</span> or drag and drop</p>
+                        <p class="text-xs text-gray-500 dark:text-gray-400">SVG, PNG, JPG or GIF (MAX. 800x400px)</p>
+                    </div>
+                    <input id="dropzone-file" type="file" accept="image/*" class="hidden" />
+                </label>
+            </div>
+            
+            <!-- Image Preview container -->
+            <div id="image-preview" class="w-full hidden">
+                <div class="relative">
+                    <img id="preview-img" src="" alt="Preview" class="w-full h-auto rounded-lg">
+                    <button id="remove-image" class="absolute top-2 right-2 bg-red-500 text-white rounded-full p-1 hover:bg-red-600" title="Remove image">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+                        </svg>
+                    </button>
+                </div>
+            </div>
+            
+            <button id="submit-button" type="submit" class="mt-6 bg-violet-600 hover:bg-violet-700 text-white font-bold py-2 px-4 rounded transition duration-300">
+                Submit
+            </button>
+        </div> 
+        
+        <div id="response-box" class="mt-8 bg-white text-gray-900 p-6 rounded-lg shadow-lg max-w-lg w-full text-center opacity-0 transition-opacity duration-500 ease-in-out">
+            <h2 class="text-2xl font-semibold text-violet-700">Response:</h2>
+            <p id="ai-response" class="text-lg text-gray-700 mt-2 italic">Waiting for input...</p>
+        </div>
+    </div>
+
+    <script>
+        // Get all needed elements
+        const dropzoneFile = document.getElementById('dropzone-file');
+        const uploadArea = document.getElementById('upload-area');
+        const imagePreview = document.getElementById('image-preview');
+        const previewImg = document.getElementById('preview-img');
+        const removeImageBtn = document.getElementById('remove-image');
+        const responseBox = document.getElementById('response-box');
+        const submitButton = document.getElementById('submit-button');
+
+        function handleFileSelect(event) {
+            const file = event.target.files[0];
+            
+            if (file && file.type.startsWith('image/')) {
+                // Create a URL for selected image
+                const imageUrl = URL.createObjectURL(file);
+                
+                // Set the image source
+                previewImg.src = imageUrl;
+                
+                // Hide upload area and show image preview
+                uploadArea.classList.add('hidden');
+                imagePreview.classList.remove('hidden');
+            }
+        }
+
+        
+        function removeImage() {
+            
+            dropzoneFile.value = '';
+            
+            // Hide image 
+            imagePreview.classList.add('hidden');
+            uploadArea.classList.remove('hidden');
+            
+            // Revoke the object
+            URL.revokeObjectURL(previewImg.src);
+            previewImg.src = '';
+        }
+
+        function handleSubmit() {
+                       responseBox.classList.remove('opacity-0');
+            
+            //Example usage
+            document.getElementById('ai-response').textContent = 'Image uploaded successfully!';
+        }
+
+        // Add event listeners
+        dropzoneFile.addEventListener('change', handleFileSelect);
+        removeImageBtn.addEventListener('click', removeImage);
+        submitButton.addEventListener('click', handleSubmit);
+    </script>
+</body>
+</html>{% endblock %}
+
