diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js
index fa3c42eb..c3155512 100644
--- a/src/hooks/option/useCanvasSetting.js
+++ b/src/hooks/option/useCanvasSetting.js
@@ -7,7 +7,7 @@ import { useAxios } from '@/hooks/useAxios'
 import { useSwal } from '@/hooks/useSwal'
 import { correntObjectNoState, corridorDimensionSelector, settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom'
 import { POLYGON_TYPE } from '@/common/common'
-import { fontSelector, globalFontAtom } from '@/store/fontAtom'
+import { globalFontAtom } from '@/store/fontAtom'
 import { dimensionLineSettingsState } from '@/store/commonUtilsAtom'
 
 let objectNo
@@ -119,21 +119,23 @@ export function useCanvasSetting() {
   }, [planSizeSettingMode])
 
   const getFonts = (itemValue) => {
+    if (!itemValue) return { id: 1, name: 'MS PGothic', value: 'MS PGothic' }
     const data = [
       { id: 1, name: 'MS PGothic', value: 'MS PGothic' },
       { id: 2, name: '@Yu Gothic', value: '@Yu Gothic' },
       { id: 3, name: 'Yu Gothic', value: 'Yu Gothic' },
       { id: 4, name: '@Yu Gothic UI', value: '@Yu Gothic UI' },
       { id: 5, name: 'Yu Gothic UI', value: 'Yu Gothic UI' },
-    ].filter((font) => font.value === itemValue)[0]
+    ].filter((font) => font.value === itemValue)
     if (data.length !== 0) {
-      return data
+      return data[0]
     } else {
       return { id: 1, name: 'MS PGothic', value: 'MS PGothic' }
     }
   }
 
   const getFontSizes = (itemValue) => {
+    if (!itemValue) return { id: 16, name: 16, value: 16 }
     const data = [
       ...Array.from({ length: 4 }).map((_, index) => {
         return { id: index + 8, name: index + 8, value: index + 8 }
@@ -144,29 +146,31 @@ export function useCanvasSetting() {
       { id: 36, name: 36, value: 36 },
       { id: 48, name: 48, value: 48 },
       { id: 72, name: 72, value: 72 },
-    ].filter((fontSize) => fontSize.value === itemValue)[0]
+    ].filter((fontSize) => fontSize.value === itemValue)
     if (data.length !== 0) {
-      return data
+      return data[0]
     } else {
       return { id: 16, name: 16, value: 16 }
     }
   }
 
   const getFontStyles = (itemValue) => {
+    if (!itemValue) return { id: 'normal', name: getMessage('font.style.normal'), value: 'normal' }
     const data = [
       { id: 'normal', name: getMessage('font.style.normal'), value: 'normal' },
       { id: 'italic', name: getMessage('font.style.italic'), value: 'italic' },
       { id: 'bold', name: getMessage('font.style.bold'), value: 'bold' },
       { id: 'boldAndItalic', name: getMessage('font.style.bold.italic'), value: 'boldAndItalic' },
-    ].filter((fontStyle) => fontStyle.value === itemValue)[0]
+    ].filter((fontStyle) => fontStyle.value === itemValue)
     if (data.length !== 0) {
-      return data
+      return data[0]
     } else {
       return { id: 'normal', name: getMessage('font.style.normal'), value: 'normal' }
     }
   }
 
   const getFontColors = (itemValue) => {
+    if (!itemValue) return { id: 'black', name: getMessage('color.black'), value: 'black' }
     const data = [
       { id: 'black', name: getMessage('color.black'), value: 'black' },
       { id: 'red', name: getMessage('color.red'), value: 'red' },
@@ -177,9 +181,9 @@ export function useCanvasSetting() {
       { id: 'pink', name: getMessage('color.pink'), value: 'pink' },
       { id: 'gold', name: getMessage('color.gold'), value: 'gold' },
       { id: 'darkblue', name: getMessage('color.darkblue'), value: 'darkblue' },
-    ].filter((fontColor) => fontColor.value === itemValue)[0]
+    ].filter((fontColor) => fontColor.value === itemValue)
     if (data.length !== 0) {
-      return data
+      return data[0]
     } else {
       return { id: 'black', name: getMessage('color.black'), value: 'black' }
     }