diff --git a/ui/src/components/CustomizeTheme/index.tsx b/ui/src/components/CustomizeTheme/index.tsx
index 4630c9c6..63524e37 100644
--- a/ui/src/components/CustomizeTheme/index.tsx
+++ b/ui/src/components/CustomizeTheme/index.tsx
@@ -64,8 +64,15 @@ const Index: FC = () => {
                 border-color: ${primaryColor.hex()};
               }
               .form-check-input:focus {
+                border-color: ${tintColor(primaryColor, 0.5)};
                 box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), .4);
               }
+              .form-switch .form-check-input:focus {
+                background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27${tintColor(
+                  primaryColor,
+                  0.5,
+                )}%27/%3e%3c/svg%3e");
+              }
               .dropdown-menu {
                 --bs-dropdown-link-active-bg: rgb(var(--bs-primary-rgb));
               }