diff --git a/web/i18n/en/button.json b/web/i18n/en/button.json
index f387e7d4..4c29c342 100644
--- a/web/i18n/en/button.json
+++ b/web/i18n/en/button.json
@@ -21,5 +21,6 @@
     "show_input": "show input",
     "hide_input": "hide input",
     "restore_input": "restore input",
-    "clear_input": "clear input"
+    "clear_input": "clear input",
+    "clear_cache": "clear cache"
 }
diff --git a/web/i18n/en/dialog.json b/web/i18n/en/dialog.json
index 3e6f5dec..35a15a8c 100644
--- a/web/i18n/en/dialog.json
+++ b/web/i18n/en/dialog.json
@@ -1,6 +1,6 @@
 {
-    "reset.title": "reset all data?",
-    "reset.body": "are you sure you want to reset all data? this action is immediate and irreversible.",
+    "reset_settings.title": "reset all settings?",
+    "reset_settings.body": "are you sure you want to reset all settings? this action is immediate and irreversible.",
 
     "picker.title": "select what to save",
     "picker.description.desktop": "click an item to save it. images can also be saved via the right click menu.",
@@ -21,5 +21,8 @@
     "safety.custom_instance.body": "custom instances can potentially pose privacy & safety risks.\n\nbad instances can:\n1. redirect you away from cobalt and try to scam you.\n2. log all information about your requests, store it forever, and use it to track you.\n3. serve you malicious files (such as malware).\n4. force you to watch ads, or make you pay for downloading.\n\nafter this point, we can't protect you. please be mindful of what instances to use and always trust your gut. if anything feels off, come back to this page, reset the custom instance, and report it to us on github.",
 
     "processing.ongoing": "cobalt is currently processing media in this tab. going away will abort it. are you sure you want to do this?",
-    "processing.title.ongoing": "processing will be cancelled"
+    "processing.title.ongoing": "processing will be cancelled",
+
+    "clear_cache.title": "clear all cache?",
+    "clear_cache.body": "all files from the processing queue will be removed and on-device features will take longer to load. this action is immediate and irreversible."
 }
diff --git a/web/i18n/en/settings.json b/web/i18n/en/settings.json
index f4b28b34..ca1374d1 100644
--- a/web/i18n/en/settings.json
+++ b/web/i18n/en/settings.json
@@ -111,8 +111,6 @@
     "advanced.debug.title": "enable features for nerds",
     "advanced.debug.description": "gives you easy access to app info that can be useful for debugging. enabling this does not affect functionality of cobalt in any way.",
 
-    "advanced.data": "data management",
-
     "advanced.local-processing": "local processing",
     "advanced.local-processing.title": "mux and convert media on device",
     "advanced.local-processing.description": "when downloading media, cobalt will use on-device processing to mux or convert it. exclusive local features such as remux or convert are not affected, they always run locally.",
@@ -126,5 +124,8 @@
     "processing.access_key.description": "cobalt will use this key to make requests to the processing instance instead of other authentication methods. make sure the instance supports api keys!",
 
     "processing.custom_instance.input.alt_text": "custom instance domain",
-    "processing.access_key.input.alt_text": "u-u-i-d access key"
+    "processing.access_key.input.alt_text": "u-u-i-d access key",
+
+    "advanced.settings_data": "settings data",
+    "advanced.local_storage": "local storage"
 }
diff --git a/web/src/components/settings/ClearStorageButton.svelte b/web/src/components/settings/ClearStorageButton.svelte
new file mode 100644
index 00000000..04e6d852
--- /dev/null
+++ b/web/src/components/settings/ClearStorageButton.svelte
@@ -0,0 +1,42 @@
+<script lang="ts">
+    import { t } from "$lib/i18n/translations";
+    import { createDialog } from "$lib/state/dialogs";
+    import { clearQueue } from "$lib/state/queen-bee/queue";
+    import { clearCacheStorage, clearFileStorage } from "$lib/storage";
+
+    import IconFileShredder from "@tabler/icons-svelte/IconFileShredder.svelte";
+    import DataSettingsButton from "$components/settings/DataSettingsButton.svelte";
+
+    const clearDialog = () => {
+        createDialog({
+            id: "wipe-confirm",
+            type: "small",
+            icon: "warn-red",
+            title: $t("dialog.clear_cache.title"),
+            bodyText: $t("dialog.clear_cache.body"),
+            buttons: [
+                {
+                    text: $t("button.cancel"),
+                    main: false,
+                    action: () => {},
+                },
+                {
+                    text: $t("button.clear"),
+                    color: "red",
+                    main: true,
+                    timeout: 2000,
+                    action: async () => {
+                        clearQueue();
+                        await clearFileStorage();
+                        await clearCacheStorage();
+                    },
+                },
+            ],
+        });
+    };
+</script>
+
+<DataSettingsButton id="clear-cache" click={clearDialog} danger>
+    <IconFileShredder />
+    {$t("button.clear_cache")}
+</DataSettingsButton>
diff --git a/web/src/components/settings/DataSettingsButton.svelte b/web/src/components/settings/DataSettingsButton.svelte
new file mode 100644
index 00000000..653a72a7
--- /dev/null
+++ b/web/src/components/settings/DataSettingsButton.svelte
@@ -0,0 +1,32 @@
+<script lang="ts">
+    export let id: string;
+    export let click: () => void;
+    export let danger = false;
+</script>
+
+<button {id} class="button data-button" class:danger on:click={click}>
+    <slot></slot>
+</button>
+
+<style>
+    .data-button {
+        padding: 8px 14px;
+        width: max-content;
+        text-align: start;
+    }
+
+    .data-button :global(svg) {
+        stroke-width: 1.8px;
+        height: 21px;
+        width: 21px;
+    }
+
+    .data-button.danger {
+        background-color: var(--red);
+        color: var(--white);
+    }
+
+    .data-button.danger:hover {
+        background-color: var(--dark-red);
+    }
+</style>
diff --git a/web/src/components/settings/ManageSettings.svelte b/web/src/components/settings/ManageSettings.svelte
index abc053bf..273f0f32 100644
--- a/web/src/components/settings/ManageSettings.svelte
+++ b/web/src/components/settings/ManageSettings.svelte
@@ -5,7 +5,7 @@
     import { validateSettings } from "$lib/settings/validate";
     import { storedSettings, updateSetting, loadFromString } from "$lib/state/settings";
 
-    import ActionButton from "$components/buttons/ActionButton.svelte";
+    import DataSettingsButton from "$components/settings/DataSettingsButton.svelte";
     import ResetSettingsButton from "$components/settings/ResetSettingsButton.svelte";
 
     import IconFileExport from "@tabler/icons-svelte/IconFileExport.svelte";
@@ -95,16 +95,16 @@
 </script>
 
 <div class="button-row" id="settings-data-transfer">
-    <ActionButton id="import-settings" click={importSettings}>
+    <DataSettingsButton id="import-settings" click={importSettings}>
         <IconFileImport />
         {$t("button.import")}
-    </ActionButton>
+    </DataSettingsButton>
 
     {#if $storedSettings.schemaVersion}
-        <ActionButton id="export-settings" click={exportSettings}>
+        <DataSettingsButton id="export-settings" click={exportSettings}>
             <IconFileExport />
             {$t("button.export")}
-        </ActionButton>
+        </DataSettingsButton>
     {/if}
 
     {#if $storedSettings.schemaVersion}
diff --git a/web/src/components/settings/ResetSettingsButton.svelte b/web/src/components/settings/ResetSettingsButton.svelte
index acc1465d..f05b0684 100644
--- a/web/src/components/settings/ResetSettingsButton.svelte
+++ b/web/src/components/settings/ResetSettingsButton.svelte
@@ -3,15 +3,16 @@
     import { createDialog } from "$lib/state/dialogs";
     import { resetSettings } from "$lib/state/settings";
 
-    import IconTrash from "@tabler/icons-svelte/IconTrash.svelte";
+    import IconRestore from "@tabler/icons-svelte/IconRestore.svelte";
+    import DataSettingsButton from "$components/settings/DataSettingsButton.svelte";
 
     const resetDialog = () => {
         createDialog({
             id: "wipe-confirm",
             type: "small",
             icon: "warn-red",
-            title: $t("dialog.reset.title"),
-            bodyText: $t("dialog.reset.body"),
+            title: $t("dialog.reset_settings.title"),
+            bodyText: $t("dialog.reset_settings.body"),
             buttons: [
                 {
                     text: $t("button.cancel"),
@@ -30,26 +31,7 @@
     };
 </script>
 
-<button id="setting-button-reset" class="button" on:click={resetDialog}>
-    <IconTrash />
+<DataSettingsButton id="reset-settings" click={resetDialog} danger>
+    <IconRestore />
     {$t("button.reset")}
-</button>
-
-<style>
-    #setting-button-reset {
-        background-color: var(--red);
-        color: var(--white);
-        width: max-content;
-        text-align: start;
-    }
-
-    #setting-button-reset:hover {
-        background-color: var(--dark-red);
-    }
-
-    #setting-button-reset :global(svg) {
-        stroke-width: 2px;
-        height: 24px;
-        width: 24px;
-    }
-</style>
+</DataSettingsButton>
diff --git a/web/src/routes/settings/advanced/+page.svelte b/web/src/routes/settings/advanced/+page.svelte
index f66ada39..7c533ecc 100644
--- a/web/src/routes/settings/advanced/+page.svelte
+++ b/web/src/routes/settings/advanced/+page.svelte
@@ -1,9 +1,11 @@
 <script lang="ts">
     import { t } from "$lib/i18n/translations";
+    import { getStorageQuota } from "$lib/storage";
 
     import SettingsToggle from "$components/buttons/SettingsToggle.svelte";
     import ManageSettings from "$components/settings/ManageSettings.svelte";
     import SettingsCategory from "$components/settings/SettingsCategory.svelte";
+    import ClearStorageButton from "$components/settings/ClearStorageButton.svelte";
 </script>
 
 <SettingsCategory sectionId="debug" title={$t("settings.advanced.debug")}>
@@ -15,6 +17,10 @@
     />
 </SettingsCategory>
 
-<SettingsCategory sectionId="data" title={$t("settings.advanced.data")}>
+<SettingsCategory sectionId="settings-data" title={$t("settings.advanced.settings_data")}>
     <ManageSettings />
 </SettingsCategory>
+
+<SettingsCategory sectionId="local-storage" title={$t("settings.advanced.local_storage")}>
+    <ClearStorageButton />
+</SettingsCategory>