diff --git a/src/App.vue b/src/App.vue
index 3f554c2..5d7fad2 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -71,8 +71,9 @@ import ActionBar from '@/components/ActionBar.vue'
 import CodeModal from '@/components/CodeModal.vue'
 import Configurator from '@/components/Configurator.vue'
 import DownloadModal from '@/components/DownloadModal.vue'
-import type { VueColorAvatarRef } from '@/components/VueColorAvatar.vue'
-import VueColorAvatar from '@/components/VueColorAvatar.vue'
+import VueColorAvatar, {
+  type VueColorAvatarRef,
+} from '@/components/VueColorAvatar.vue'
 import { ActionType } from '@/enums'
 import { useAvatarOption } from '@/hooks'
 import Container from '@/layouts/Container.vue'
diff --git a/src/components/Configurator.vue b/src/components/Configurator.vue
index 35ffc31..40ee789 100644
--- a/src/components/Configurator.vue
+++ b/src/components/Configurator.vue
@@ -70,8 +70,7 @@ import { useI18n } from 'vue-i18n'
 
 import PerfectScrollbar from '@/components/PerfectScrollbar.vue'
 import SectionWrapper from '@/components/SectionWrapper.vue'
-import type { WidgetShape, WrapperShape } from '@/enums'
-import { WidgetType } from '@/enums'
+import { type WidgetShape, type WrapperShape, WidgetType } from '@/enums'
 import { useAvatarOption } from '@/hooks'
 import { SETTINGS } from '@/utils/constant'
 import { previewData } from '@/utils/dynamic-data'
diff --git a/src/components/VueColorAvatar.vue b/src/components/VueColorAvatar.vue
index cf2570f..eeee0a0 100644
--- a/src/components/VueColorAvatar.vue
+++ b/src/components/VueColorAvatar.vue
@@ -24,7 +24,7 @@ export interface VueColorAvatarRef {
 import { ref, toRefs, watchEffect } from 'vue'
 
 import { WrapperShape } from '@/enums'
-import type { AvatarOption } from '@/types'
+import { type AvatarOption } from '@/types'
 import { getRandomAvatarOption } from '@/utils'
 import { AVATAR_LAYER, NONE } from '@/utils/constant'
 import { widgetData } from '@/utils/dynamic-data'
diff --git a/src/components/widgets/Background.vue b/src/components/widgets/Background.vue
index 8f3e9a0..b4715da 100644
--- a/src/components/widgets/Background.vue
+++ b/src/components/widgets/Background.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script lang="ts" setup>
-import type { AvatarOption } from '../../types'
+import { type AvatarOption } from '../../types'
 
 interface BackgroundProps {
   color: AvatarOption['background']['color']
diff --git a/src/env.d.ts b/src/env.d.ts
index 6154aca..d9fd059 100644
--- a/src/env.d.ts
+++ b/src/env.d.ts
@@ -1,7 +1,7 @@
 /// <reference types="vite/client" />
 
 declare module '*.vue' {
-  import type { DefineComponent } from 'vue'
+  import { type DefineComponent } from 'vue'
   // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
   const component: DefineComponent<{}, {}, any>
   export default component
diff --git a/src/hooks/useAvatarOption.ts b/src/hooks/useAvatarOption.ts
index b204899..ab05fc7 100644
--- a/src/hooks/useAvatarOption.ts
+++ b/src/hooks/useAvatarOption.ts
@@ -2,7 +2,7 @@ import { computed } from 'vue'
 
 import { useStore } from '@/store'
 import { SET_AVATAR_OPTION } from '@/store/mutation-type'
-import type { AvatarOption } from '@/types'
+import { type AvatarOption } from '@/types'
 
 export default function useAvatarOption() {
   const store = useStore()
diff --git a/src/store/index.ts b/src/store/index.ts
index a1fc000..ccbc134 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -1,9 +1,8 @@
-import type { InjectionKey } from 'vue'
-import type { Store } from 'vuex'
-import { createStore, useStore as baseUseStore } from 'vuex'
+import { type InjectionKey } from 'vue'
+import { type Store, createStore, useStore as baseUseStore } from 'vuex'
 
 import { WrapperShape } from '@/enums'
-import type { AvatarOption } from '@/types'
+import { type AvatarOption } from '@/types'
 import { getRandomAvatarOption } from '@/utils'
 import { SCREEN } from '@/utils/constant'
 
diff --git a/src/types/index.ts b/src/types/index.ts
index 171d7b2..211cf3e 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -1,21 +1,21 @@
-import type { NONE } from '@/utils/constant'
+import { type NONE } from '@/utils/constant'
 
 export type None = typeof NONE
 
-import type {
-  BeardShape,
-  ClothesShape,
-  EarringsShape,
-  EarShape,
-  EyebrowsShape,
-  EyesShape,
-  FaceShape,
-  Gender,
-  GlassesShape,
-  MouthShape,
-  NoseShape,
-  TopsShape,
-  WrapperShape,
+import {
+  type BeardShape,
+  type ClothesShape,
+  type EarringsShape,
+  type EarShape,
+  type EyebrowsShape,
+  type EyesShape,
+  type FaceShape,
+  type Gender,
+  type GlassesShape,
+  type MouthShape,
+  type NoseShape,
+  type TopsShape,
+  type WrapperShape,
 } from '../enums'
 
 interface Widget<Shape> {
diff --git a/src/utils/constant.ts b/src/utils/constant.ts
index edabb31..4899fe0 100644
--- a/src/utils/constant.ts
+++ b/src/utils/constant.ts
@@ -1,4 +1,4 @@
-import type { AvatarOption, AvatarSettings } from '@/types'
+import { type AvatarOption, type AvatarSettings } from '@/types'
 
 import {
   BeardShape,
diff --git a/src/utils/index.ts b/src/utils/index.ts
index a236c22..164cdaf 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,6 +1,11 @@
-import type { EarringsShape, GlassesShape } from '@/enums'
-import { BeardShape, Gender, TopsShape } from '@/enums'
-import type { AvatarOption, None } from '@/types'
+import {
+  type EarringsShape,
+  type GlassesShape,
+  BeardShape,
+  Gender,
+  TopsShape,
+} from '@/enums'
+import { type AvatarOption, type None } from '@/types'
 
 import { NONE, SETTINGS, SPECIAL_AVATARS } from './constant'