diff --git a/web/src/assets/locales/en.json b/web/src/assets/locales/en.json
index b6b3eef9d..cbf40beae 100644
--- a/web/src/assets/locales/en.json
+++ b/web/src/assets/locales/en.json
@@ -1,4 +1,5 @@
 {
+    "cancel": "Cancel",
     "login": "Login",
     "welcome": "Welcome to Woodpecker",
     "repos": "Repos",
diff --git a/web/src/components/admin/settings/AdminSecretsTab.vue b/web/src/components/admin/settings/AdminSecretsTab.vue
index 16e04e134..653790e57 100644
--- a/web/src/components/admin/settings/AdminSecretsTab.vue
+++ b/web/src/components/admin/settings/AdminSecretsTab.vue
@@ -40,6 +40,7 @@
       i18n-prefix="admin.settings.secrets."
       :is-saving="isSaving"
       @save="createSecret"
+      @cancel="selectedSecret = undefined"
     />
   </Panel>
 </template>
diff --git a/web/src/components/org/settings/OrgSecretsTab.vue b/web/src/components/org/settings/OrgSecretsTab.vue
index e46527008..d52ff88b8 100644
--- a/web/src/components/org/settings/OrgSecretsTab.vue
+++ b/web/src/components/org/settings/OrgSecretsTab.vue
@@ -33,6 +33,7 @@
       i18n-prefix="org.settings.secrets."
       :is-saving="isSaving"
       @save="createSecret"
+      @cancel="selectedSecret = undefined"
     />
   </Panel>
 </template>
diff --git a/web/src/components/repo/settings/SecretsTab.vue b/web/src/components/repo/settings/SecretsTab.vue
index 063acc0f4..a09da138a 100644
--- a/web/src/components/repo/settings/SecretsTab.vue
+++ b/web/src/components/repo/settings/SecretsTab.vue
@@ -33,6 +33,7 @@
       i18n-prefix="repo.settings.secrets."
       :is-saving="isSaving"
       @save="createSecret"
+      @cancel="selectedSecret = undefined"
     />
   </Panel>
 </template>
diff --git a/web/src/components/secrets/SecretEdit.vue b/web/src/components/secrets/SecretEdit.vue
index 056acad4f..5e37b5fe4 100644
--- a/web/src/components/secrets/SecretEdit.vue
+++ b/web/src/components/secrets/SecretEdit.vue
@@ -24,6 +24,7 @@
         <CheckboxesField v-model="innerValue.event" :options="secretEventsOptions" />
       </InputField>
 
+      <Button type="button" color="gray" :text="$t('cancel')" @click="$emit('cancel')" />
       <Button
         type="submit"
         color="green"
@@ -54,6 +55,7 @@ const props = defineProps<{
 const emit = defineEmits<{
   (event: 'update:modelValue', value: Partial<Secret> | undefined): void;
   (event: 'save', value: Partial<Secret>): void;
+  (event: 'cancel'): void;
 }>();
 
 const i18n = useI18n();