diff --git a/src/module.ts b/src/module.ts
index ffa97cb7..b39f8e2b 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -8,6 +8,7 @@ import {
   createResolver,
   defineNuxtModule,
   extendPages,
+  addComponentsDir,
 } from '@nuxt/kit'
 import type { HookResult } from '@nuxt/schema'
 import { setupDevToolsUI } from './devtools'
@@ -69,7 +70,7 @@ export default defineNuxtModule<ModuleOptions>({
       return (forms.length > 2 ? forms[2].trim() : forms[forms.length - 1].trim()).replace('{count}', count.toString())
     }`,
   },
-  setup: function (options, nuxt) {
+  setup: async function (options, nuxt) {
     const resolver = createResolver(import.meta.url)
 
     nuxt.options.runtimeConfig.public.i18nConfig = {
@@ -123,6 +124,12 @@ export default defineNuxtModule<ModuleOptions>({
       handler: resolver.resolve('./runtime/server/middleware/i18n-loader'),
     })
 
+    await addComponentsDir({
+      path: resolver.resolve('./runtime/components'),
+      pathPrefix: false,
+      extensions: ['vue'],
+    })
+
     const localeRegex = options.locales!
       .filter(locale => locale.code !== options.defaultLocale || options.includeDefaultLocaleRoute) // Фильтрация локалей, исключая дефолтную
       .map(locale => locale.code) // Извлечение поля code из каждого объекта Locale
diff --git a/src/runtime/components/i18n-t.vue b/src/runtime/components/i18n-t.vue
new file mode 100644
index 00000000..a0a8f3c4
--- /dev/null
+++ b/src/runtime/components/i18n-t.vue
@@ -0,0 +1,61 @@
+<template>
+  <component
+    :is="tag"
+    v-if="!hideIfEmpty || translation"
+  >
+    <slot
+      v-if="!html"
+      :translation="translation"
+    >
+      {{ translation }}
+    </slot>
+    <span
+      v-else
+      v-html="translation"
+    />
+  </component>
+</template>
+
+<script lang="ts" setup>
+import { computed, defineProps, withDefaults } from 'vue'
+import { useNuxtApp } from '#app'
+
+interface Props {
+  keypath: string
+  plural?: number | null
+  tag?: string
+  scope?: string
+  params?: Record<string, string | number | boolean>
+  defaultValue?: string
+  html?: boolean
+  locale?: string
+  wrap?: boolean
+  customPluralRule?: (value: string, count: number, locale: string) => string
+  hideIfEmpty?: boolean
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  plural: null,
+  tag: 'span',
+  scope: 'global',
+  params: () => ({}),
+  defaultValue: '',
+  html: false,
+  locale: undefined,
+  wrap: true,
+  hideIfEmpty: false,
+})
+
+const nuxtApp = useNuxtApp()
+
+const translation = computed<string>(() => {
+  const localeToUse = props.locale || nuxtApp.$getLocale()
+  const translation = props.plural !== null
+    ? props.customPluralRule
+      ? props.customPluralRule(nuxtApp.$t(props.keypath, props.params), props.plural, localeToUse)
+      : nuxtApp.$tc(props.keypath, props.plural)
+    : nuxtApp.$t(props.keypath, props.params) as string
+
+  return translation || props.defaultValue || props.keypath
+})
+</script>