diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx
index ebd71b6..a16d163 100644
--- a/src/components/LanguageSwitcher.tsx
+++ b/src/components/LanguageSwitcher.tsx
@@ -48,6 +48,7 @@ export function LanguageSwitcher() {
             key={item.code}
             onSelect={(e) => handleSelect(e, item.code)}
             className={cn(
+              "text-xs",
               {
                 "gap-3 bg-muted font-semibold": locale === item.code,
               },
diff --git a/src/components/ThemeSwitcher.tsx b/src/components/ThemeSwitcher.tsx
index 4005c50..02ef6be 100644
--- a/src/components/ThemeSwitcher.tsx
+++ b/src/components/ThemeSwitcher.tsx
@@ -36,21 +36,21 @@ export function ModeToggle() {
       </DropdownMenuTrigger>
       <DropdownMenuContent className="flex flex-col gap-0.5" align="end">
         <DropdownMenuItem
-          className={cn("rounded-b-[5px]", { "gap-3 bg-muted font-semibold": theme === "light" })}
+          className={cn("rounded-b-[5px] text-xs", { "gap-3 bg-muted font-semibold": theme === "light" })}
           onSelect={(e) => handleSelect(e, "light")}
         >
           {t("theme.light")}
           {theme === "light" && <CheckCircleIcon className="size-4" />}
         </DropdownMenuItem>
         <DropdownMenuItem
-          className={cn("rounded-[5px]", { "gap-3 bg-muted font-semibold": theme === "dark" })}
+          className={cn("rounded-[5px] text-xs", { "gap-3 bg-muted font-semibold": theme === "dark" })}
           onSelect={(e) => handleSelect(e, "dark")}
         >
           {t("theme.dark")}
           {theme === "dark" && <CheckCircleIcon className="size-4" />}
         </DropdownMenuItem>
         <DropdownMenuItem
-          className={cn("rounded-t-[5px]", { "gap-3 bg-muted font-semibold": theme === "system" })}
+          className={cn("rounded-t-[5px] text-xs", { "gap-3 bg-muted font-semibold": theme === "system" })}
           onSelect={(e) => handleSelect(e, "system")}
         >
           {t("theme.system")}