diff --git a/components/character/CharacterHovercard/index.tsx b/components/character/CharacterHovercard/index.tsx
index 47d066ff..b65d23a2 100644
--- a/components/character/CharacterHovercard/index.tsx
+++ b/components/character/CharacterHovercard/index.tsx
@@ -16,7 +16,6 @@ import {
   aetherialMastery,
   permanentMastery,
 } from '~data/overMastery'
-import { characterAwakening } from '~data/awakening'
 import { ExtendedMastery } from '~types'
 
 import './index.scss'
@@ -27,13 +26,6 @@ interface Props {
   onTriggerClick: () => void
 }
 
-interface KeyNames {
-  [key: string]: {
-    en: string
-    jp: string
-  }
-}
-
 const CharacterHovercard = (props: Props) => {
   const router = useRouter()
   const { t } = useTranslation('common')
@@ -181,27 +173,20 @@ const CharacterHovercard = (props: Props) => {
 
   const awakeningSection = () => {
     const gridAwakening = props.gridCharacter.awakening
-    const awakening = characterAwakening.find(
-      (awakening) => awakening.id === gridAwakening?.type
-    )
 
-    if (gridAwakening && awakening) {
+    if (gridAwakening) {
       return (
         <section className="Awakening">
           <h5 className={tintElement}>
             {t('modals.characters.subtitles.awakening')}
           </h5>
           <div>
-            {gridAwakening.type > 1 ? (
-              <img
-                alt={awakening.name[locale]}
-                src={`${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/awakening/character_${gridAwakening.type}.jpg`}
-              />
-            ) : (
-              ''
-            )}
+            <img
+              alt={gridAwakening.type.name[locale]}
+              src={`${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/awakening/${gridAwakening.type.slug}.jpg`}
+            />
             <span>
-              <strong>{`${awakening.name[locale]}`}</strong>&nbsp;
+              <strong>{`${gridAwakening.type.name[locale]}`}</strong>&nbsp;
               {`Lv${gridAwakening.level}`}
             </span>
           </div>
diff --git a/components/weapon/WeaponHovercard/index.tsx b/components/weapon/WeaponHovercard/index.tsx
index c0e3f48b..1e9132c1 100644
--- a/components/weapon/WeaponHovercard/index.tsx
+++ b/components/weapon/WeaponHovercard/index.tsx
@@ -12,7 +12,6 @@ import WeaponLabelIcon from '~components/weapon/WeaponLabelIcon'
 import UncapIndicator from '~components/uncap/UncapIndicator'
 
 import ax from '~data/ax'
-import { weaponAwakening } from '~data/awakening'
 
 import './index.scss'
 
@@ -146,11 +145,8 @@ const WeaponHovercard = (props: Props) => {
 
   const awakeningSection = () => {
     const gridAwakening = props.gridWeapon.awakening
-    const awakening = weaponAwakening.find(
-      (awakening) => awakening.id === gridAwakening?.type
-    )
 
-    if (gridAwakening && awakening) {
+    if (gridAwakening) {
       return (
         <section className="awakening">
           <h5 className={tintElement}>
@@ -158,11 +154,11 @@ const WeaponHovercard = (props: Props) => {
           </h5>
           <div>
             <img
-              alt={awakening.name[locale]}
-              src={`${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/awakening/weapon_${gridAwakening.type}.png`}
+              alt={gridAwakening.type.name[locale]}
+              src={`${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/awakening/${gridAwakening.type.slug}.png`}
             />
             <span>
-              <strong>{`${awakening.name[locale]}`}</strong>&nbsp;
+              <strong>{`${gridAwakening.type.name[locale]}`}</strong>&nbsp;
               {`Lv${gridAwakening.level}`}
             </span>
           </div>