diff --git a/public/index.html b/public/index.html
index 1539f15a9..df054e0da 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1008,7 +1008,10 @@
                                 <h5>Get it here: <a target="_blank" href="https://horde.koboldai.net/register">Register</a><br>
                                     Enter <span class="monospace">0000000000</span> to use anonymous mode.
                                 </h5>
-                                <input id="horde_api_key" name="horde_api_key" class="text_pole" maxlength="500" type="text" placeholder="0000000000">
+                                <div class="flex-container">
+                                    <input id="horde_api_key" name="horde_api_key" class="text_pole flex1" maxlength="500" type="text" placeholder="0000000000">
+                                    <div title="Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_horde"></div>
+                                </div>
                                 <div class="neutral_warning">For privacy reasons, your API key will hidden after you reload the page.</div>
                                 <h4 class="horde_model_title">
                                     Model
@@ -1039,7 +1042,10 @@
                                     <li>Enter it in the box below:</li>
                                 </ol>
                             </span>
-                            <input id="api_key_novel" name="api_key_novel" class="text_pole" maxlength="500" size="35" type="text">
+                            <div class="flex-container">
+                                <input id="api_key_novel" name="api_key_novel" class="text_pole flex1" maxlength="500" size="35" type="text">
+                                <div title="Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_novel"></div>
+                            </div>
                             <div class="neutral_warning">For privacy reasons, your API key will hidden after you reload the page.</div>
                             <input id="api_button_novel" class="menu_button" type="submit" value="Connect">
                             <div id="api_loading_novel" class="api-load-icon fa-solid fa-hourglass fa-spin"></div>
@@ -1093,7 +1099,10 @@
                                     <li>Enter it in the box below:</li>
                                 </ol>
                             </span>
-                            <input id="api_key_openai" name="api_key_openai" class="text_pole" maxlength="500" value="" type="text">
+                            <div class="flex-container">
+                                <input id="api_key_openai" name="api_key_openai" class="text_pole flex1" maxlength="500" value="" type="text">
+                                <div title="Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_openai"></div>
+                            </div>
                             <div class="neutral_warning">For privacy reasons, your API key will hidden after you reload the page.</div>
                             <input id="api_button_openai" class="menu_button" type="submit" value="Connect">
                             <div id="api_loading_openai" class=" api-load-icon fa-solid fa-hourglass fa-spin"></div>
@@ -1130,7 +1139,10 @@
                             </ol>
                         </span>
                         <div class="widthFreeExpand">
-                            <input id="poe_token" class="text_pole" type="text" maxlength="100" />
+                            <div class="flex-container">
+                                <input id="poe_token" class="text_pole flex1" type="text" maxlength="100" />
+                                <div title="Clear your API key" class="menu_button fa-solid fa-circle-xmark clear-api-key" data-key="api_key_poe"></div>
+                            </div>
                             <div class="neutral_warning">For privacy reasons, your API key will hidden after you reload the page.</div>
                         </div>
 
diff --git a/public/scripts/secrets.js b/public/scripts/secrets.js
index 6b0c615fd..41a46a550 100644
--- a/public/scripts/secrets.js
+++ b/public/scripts/secrets.js
@@ -14,6 +14,14 @@ const INPUT_MAP = {
     [SECRET_KEYS.NOVEL]: '#api_key_novel',
 }
 
+async function clearSecret() {
+    const key = $(this).data('key');
+    await writeSecret(key, '');
+    secret_state[key] = false;
+    updateSecretDisplay();
+    $(INPUT_MAP[key]).val('');
+}
+
 function updateSecretDisplay() {
     for (const [secret_key, input_selector] of Object.entries(INPUT_MAP)) {
         const validSecret = !!secret_state[secret_key];
@@ -91,4 +99,5 @@ export async function readSecretState() {
 
 jQuery(() => {
     $('#viewSecrets').on('click', viewSecrets);
+    $(document).on('click', '.clear-api-key', clearSecret);
 });
\ No newline at end of file