diff --git a/src/views/InstanceDetail.vue b/src/views/InstanceDetail.vue
index d35c3b4..10ccfbd 100644
--- a/src/views/InstanceDetail.vue
+++ b/src/views/InstanceDetail.vue
@@ -5,6 +5,9 @@
                 <i class="fas fa-arrow-left"></i> Back
             </button>
             <h2>{{ instanceName }} - Details</h2>
+            <button class="common-btn" @click="deleteInstance">
+                <i class="fas fa-trash"></i> Delete
+            </button>
         </div>
 
         <div class="detail-content">
@@ -355,6 +358,16 @@ export default {
             }
         };
 
+        const deleteInstance = async () => {
+            try {
+                await instanceApi.deleteInstance(instanceID.value);
+                showNotification('Instance deleted successfully', 'success');
+                router.push('/instances');
+            } catch (error) {
+                showNotification(error.message || 'Delete instance failed', 'error');
+            }
+        };
+
         const restartInstance = async () => {
             try {
                 await instanceApi.restartInstance(instanceID.value);
@@ -544,7 +557,8 @@ export default {
             handleEditConfiguration,
             handleAddProxySubmit,
             handleStatusClick,
-            restartInstance
+            restartInstance,
+            deleteInstance
         };
     }
 };
@@ -561,6 +575,7 @@ export default {
     display: flex;
     align-items: center;
     gap: 16px;
+    justify-content: space-between;
 }
 
 .detail-content {