diff --git a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/edgeless/shape.tsx b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/edgeless/shape.tsx
index f3cca3a11f..78771a9aa5 100644
--- a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/edgeless/shape.tsx
+++ b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/edgeless/shape.tsx
@@ -72,7 +72,8 @@ export const ShapeSettings = () => {
   const { palettes: textColorPalettes, getCurrentColor: getCurrentTextColor } =
     usePalettes(
       DefaultTheme.ShapeTextColorShortPalettes,
-      DefaultTheme.shapeTextColor
+      DefaultTheme.shapeTextColor,
+      true
     );
 
   const [currentShape, setCurrentShape] = useState<ShapeName>(ShapeType.Rect);
diff --git a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/utils.ts b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/utils.ts
index daf7805418..0c4edf1a2e 100644
--- a/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/utils.ts
+++ b/packages/frontend/core/src/desktop/dialogs/setting/general-setting/editor/utils.ts
@@ -17,13 +17,14 @@ export const useResolvedTheme = () => {
 
 export const usePalettes = (
   originalPalettes: Palette[],
-  defaultColor: Color
+  defaultColor: Color,
+  isShapeText = false
 ) => {
   const theme = useResolvedTheme();
   const isDark = theme === ColorScheme.Dark;
   const palettes = originalPalettes.map(({ key, value }) => {
     // Title needs to be inverted.
-    if (isDark) {
+    if (!isShapeText && isDark) {
       if (key === 'Black') {
         key = 'White';
       } else if (key === 'White') {