diff --git a/packages/frontend/core/src/components/affine/language-menu/index.tsx b/packages/frontend/core/src/components/affine/language-menu/index.tsx
index e16b3b4bfa..9281e5c69c 100644
--- a/packages/frontend/core/src/components/affine/language-menu/index.tsx
+++ b/packages/frontend/core/src/components/affine/language-menu/index.tsx
@@ -15,6 +15,7 @@ const LanguageMenuContent = memo(function LanguageMenuContent() {
             key={option.name}
             selected={currentLanguage?.originalName === option.originalName}
             title={option.name}
+            lang={option.tag}
             onSelect={() => onLanguageChange(option.tag)}
           >
             {option.originalName}
diff --git a/packages/frontend/core/src/hooks/affine/use-language-helper.ts b/packages/frontend/core/src/hooks/affine/use-language-helper.ts
index f179187ca9..098441954a 100644
--- a/packages/frontend/core/src/hooks/affine/use-language-helper.ts
+++ b/packages/frontend/core/src/hooks/affine/use-language-helper.ts
@@ -1,6 +1,6 @@
 import { useAsyncCallback } from '@affine/core/hooks/affine-async-hooks';
 import { LOCALES, useI18N } from '@affine/i18n';
-import { useMemo } from 'react';
+import { useEffect, useMemo } from 'react';
 
 export function useLanguageHelper() {
   const i18n = useI18N();
@@ -24,6 +24,12 @@ export function useLanguageHelper() {
     [i18n]
   );
 
+  useEffect(() => {
+    if (currentLanguage) {
+      document.documentElement.lang = currentLanguage.tag;
+    }
+  }, [currentLanguage]);
+
   return useMemo(
     () => ({
       currentLanguage,