diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsAutoSaveCheckbox.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsAutoSaveCheckbox.tsx
new file mode 100644
index 0000000000..0dfcae290a
--- /dev/null
+++ b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsAutoSaveCheckbox.tsx
@@ -0,0 +1,20 @@
+import { Checkbox, FormControl, FormLabel } from '@invoke-ai/ui-library';
+import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { settingsAutoSaveToggled } from 'features/controlLayers/store/canvasV2Slice';
+import { memo, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+
+export const CanvasSettingsAutoSaveCheckbox = memo(() => {
+ const { t } = useTranslation();
+ const dispatch = useAppDispatch();
+ const autoSave = useAppSelector((s) => s.canvasV2.settings.autoSave);
+ const onChange = useCallback(() => dispatch(settingsAutoSaveToggled()), [dispatch]);
+ return (
+
+ {t('controlLayers.autoSave')}
+
+
+ );
+});
+
+CanvasSettingsAutoSaveCheckbox.displayName = 'CanvasSettingsAutoSaveCheckbox';
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx
index c0c91ba936..8ad4aeb22a 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/Settings/CanvasSettingsPopover.tsx
@@ -9,6 +9,7 @@ import {
PopoverTrigger,
useShiftModifier,
} from '@invoke-ai/ui-library';
+import { CanvasSettingsAutoSaveCheckbox } from 'features/controlLayers/components/Settings/CanvasSettingsAutoSaveCheckbox';
import { CanvasSettingsClearCachesButton } from 'features/controlLayers/components/Settings/CanvasSettingsClearCachesButton';
import { CanvasSettingsClipToBboxCheckbox } from 'features/controlLayers/components/Settings/CanvasSettingsClipToBboxCheckbox';
import { CanvasSettingsDynamicGridSwitch } from 'features/controlLayers/components/Settings/CanvasSettingsDynamicGridSwitch';
@@ -30,6 +31,7 @@ export const CanvasSettingsPopover = memo(() => {
+