diff --git a/web/apps/photos/src/components/Export.tsx b/web/apps/photos/src/components/Export.tsx
index 60d7acce63..a10e855fad 100644
--- a/web/apps/photos/src/components/Export.tsx
+++ b/web/apps/photos/src/components/Export.tsx
@@ -235,7 +235,7 @@ function ExportDirectory({ exportFolder, changeExportDirectory, exportStage }) {
                     )}
                 </>
             ) : (
-                <Button color={"accent"} onClick={changeExportDirectory}>
+                <Button color="accent" onClick={changeExportDirectory}>
                     {t("select_folder")}
                 </Button>
             )}
diff --git a/web/apps/photos/src/components/ExportPendingList.tsx b/web/apps/photos/src/components/ExportPendingList.tsx
index 266bb0e221..c9e87afca8 100644
--- a/web/apps/photos/src/components/ExportPendingList.tsx
+++ b/web/apps/photos/src/components/ExportPendingList.tsx
@@ -71,7 +71,7 @@ const ExportPendingList = (props: Iprops) => {
             />
             <FocusVisibleButton
                 fullWidth
-                color={"secondary"}
+                color="secondary"
                 onClick={props.onClose}
             >
                 {t("close")}
diff --git a/web/apps/photos/src/components/PhotoViewer/FileInfo.tsx b/web/apps/photos/src/components/PhotoViewer/FileInfo.tsx
index 9a27993fb3..838cf5b374 100644
--- a/web/apps/photos/src/components/PhotoViewer/FileInfo.tsx
+++ b/web/apps/photos/src/components/PhotoViewer/FileInfo.tsx
@@ -964,10 +964,7 @@ const RawExif: React.FC<RawExifProps> = ({
                 caption={fileName}
                 onRootClose={handleRootClose}
                 actionButton={
-                    <CopyButton
-                        code={JSON.stringify(tags)}
-                        color={"secondary"}
-                    />
+                    <CopyButton code={JSON.stringify(tags)} color="secondary" />
                 }
             />
             <Stack sx={{ gap: 2, py: 3, px: 1 }}>
diff --git a/web/apps/photos/src/components/PhotoViewer/index.tsx b/web/apps/photos/src/components/PhotoViewer/index.tsx
index 16c931a1d1..3fa8f01d83 100644
--- a/web/apps/photos/src/components/PhotoViewer/index.tsx
+++ b/web/apps/photos/src/components/PhotoViewer/index.tsx
@@ -1037,7 +1037,7 @@ const ConversionFailedNotification: React.FC<
         >
             <Paper sx={{ width: "320px" }}>
                 <Button
-                    color={"secondary"}
+                    color="secondary"
                     onClick={handleClick}
                     sx={{
                         borderRadius: "8px",
diff --git a/web/packages/base/components/Titlebar.tsx b/web/packages/base/components/Titlebar.tsx
index 3e0462d30c..d64041c491 100644
--- a/web/packages/base/components/Titlebar.tsx
+++ b/web/packages/base/components/Titlebar.tsx
@@ -39,7 +39,7 @@ export const Titlebar: React.FC<TitlebarProps> = ({
                 <Stack direction="row" sx={{ gap: "4px" }}>
                     {actionButton && actionButton}
                     {!backIsClose && (
-                        <IconButton onClick={onRootClose} color={"secondary"}>
+                        <IconButton onClick={onRootClose} color="secondary">
                             <CloseIcon />
                         </IconButton>
                     )}
diff --git a/web/packages/base/components/mui/SidebarDrawer.tsx b/web/packages/base/components/mui/SidebarDrawer.tsx
index 5838f31b7a..ce241f11b6 100644
--- a/web/packages/base/components/mui/SidebarDrawer.tsx
+++ b/web/packages/base/components/mui/SidebarDrawer.tsx
@@ -115,12 +115,12 @@ export const SidebarDrawerTitlebar: React.FC<SidebarDrawerTitlebarProps> = ({
 }) => (
     <Stack sx={{ gap: "4px" }}>
         <SpaceBetweenFlex sx={{ minHeight: "48px" }}>
-            <IconButton onClick={onClose} color={"primary"}>
+            <IconButton onClick={onClose} color="primary">
                 <ArrowBackIcon />
             </IconButton>
             <Stack direction="row" sx={{ gap: "4px" }}>
                 {actionButton && actionButton}
-                <IconButton onClick={onRootClose} color={"secondary"}>
+                <IconButton onClick={onRootClose} color="secondary">
                     <CloseIcon />
                 </IconButton>
             </Stack>
diff --git a/web/packages/new/photos/components/gallery/PeopleHeader.tsx b/web/packages/new/photos/components/gallery/PeopleHeader.tsx
index cb8546d178..2100994a60 100644
--- a/web/packages/new/photos/components/gallery/PeopleHeader.tsx
+++ b/web/packages/new/photos/components/gallery/PeopleHeader.tsx
@@ -721,7 +721,7 @@ const SuggestionsDialog: React.FC<SuggestionsDialogProps> = ({
                     fullWidth
                     disabled={!hasUnsavedChanges}
                     loading={state.activity == "saving"}
-                    color={"accent"}
+                    color="accent"
                     onClick={handleSave}
                 >
                     {t("save")}