diff --git a/components/CharacterUnit/index.tsx b/components/CharacterUnit/index.tsx
index 12c66138..59e7c681 100644
--- a/components/CharacterUnit/index.tsx
+++ b/components/CharacterUnit/index.tsx
@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from 'react'
+import { useRouter } from 'next/router'
 import classnames from 'classnames'
 
 import SearchModal from '~components/SearchModal'
@@ -18,6 +19,9 @@ interface Props {
 }
 
 const CharacterUnit = (props: Props) => {
+    const router = useRouter()
+    const locale = (router.locale && ['en', 'ja'].includes(router.locale)) ? router.locale : 'en'
+
     const [imageUrl, setImageUrl] = useState('')
 
     const classes = classnames({
@@ -88,7 +92,7 @@ const CharacterUnit = (props: Props) => {
                     updateUncap={passUncapData}
                     special={character.special}
                 /> : '' }
-            <h3 className="CharacterName">{character?.name.en}</h3>
+            <h3 className="CharacterName">{character?.name[locale]}</h3>
         </div>
     )
 
diff --git a/components/SummonUnit/index.tsx b/components/SummonUnit/index.tsx
index 43602695..adaa809c 100644
--- a/components/SummonUnit/index.tsx
+++ b/components/SummonUnit/index.tsx
@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from 'react'
+import { useRouter } from 'next/router'
 import classnames from 'classnames'
 
 import SearchModal from '~components/SearchModal'
@@ -20,6 +21,9 @@ interface Props {
 const SummonUnit = (props: Props) => {
     const [imageUrl, setImageUrl] = useState('')
 
+    const router = useRouter()
+    const locale = (router.locale && ['en', 'ja'].includes(router.locale)) ? router.locale : 'en'
+
     const classes = classnames({
         SummonUnit: true,
         'main': props.unitType == 0,
@@ -97,7 +101,7 @@ const SummonUnit = (props: Props) => {
                     special={false}               
                 /> : '' 
             }
-            <h3 className="SummonName">{summon?.name.en}</h3>
+            <h3 className="SummonName">{summon?.name[locale]}</h3>
         </div>
     )
 
diff --git a/components/WeaponUnit/index.tsx b/components/WeaponUnit/index.tsx
index 6674f18e..9e8909dd 100644
--- a/components/WeaponUnit/index.tsx
+++ b/components/WeaponUnit/index.tsx
@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from 'react'
+import Router, { useRouter } from 'next/router'
 import classnames from 'classnames'
 
 import SearchModal from '~components/SearchModal'
@@ -24,6 +25,9 @@ interface Props {
 const WeaponUnit = (props: Props) => {
     const [imageUrl, setImageUrl] = useState('')
 
+    const router = useRouter()
+    const locale = (router.locale && ['en', 'ja'].includes(router.locale)) ? router.locale : 'en'
+
     const classes = classnames({
         WeaponUnit: true,
         'mainhand': props.unitType == 0,
@@ -108,7 +112,7 @@ const WeaponUnit = (props: Props) => {
                     special={false}
                 /> : ''
             }
-            <h3 className="WeaponName">{weapon?.name.en}</h3>
+            <h3 className="WeaponName">{weapon?.name[locale]}</h3>
         </div>
     )