diff --git a/.eslintrc.js b/.eslintrc.js
index 6e93d4a..bfe268c 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -20,5 +20,6 @@ module.exports = {
     'comma-dangle': ['error', 'always-multiline'],
     'no-multiple-empty-lines': 'error',
     'object-curly-spacing': ['error', 'always'],
+    'vue/no-v-model-argument': 'off',
   },
 }
diff --git a/docs/components/select/examples/DisabledSelect.vue b/docs/components/select/examples/DisabledSelect.vue
index e6b4508..0aa83fa 100644
--- a/docs/components/select/examples/DisabledSelect.vue
+++ b/docs/components/select/examples/DisabledSelect.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Select v-model="selected" :options="countries" placeholder="You can't select" label="Select a country" :disabled="true" />
+    <Select v-model:value="selected" :options="countries" placeholder="You can't select" label="Select a country" :disabled="true" />
   </div>
 </template>
 
diff --git a/docs/components/select/examples/SelectExample.vue b/docs/components/select/examples/SelectExample.vue
index d1f84fd..c5f4f2a 100644
--- a/docs/components/select/examples/SelectExample.vue
+++ b/docs/components/select/examples/SelectExample.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Select v-model="selected" :options="countries" label="Select a country" />
+    <Select v-model:value="selected" :options="countries" label="Select a country" />
   </div>
 </template>
 
diff --git a/docs/components/select/examples/SelectSize.vue b/docs/components/select/examples/SelectSize.vue
index 5583775..3995c41 100644
--- a/docs/components/select/examples/SelectSize.vue
+++ b/docs/components/select/examples/SelectSize.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="flex flex-col gap-2">
-    <Select v-model="selected" :options="countries" label="Select a country" size="lg" />
-    <Select v-model="selected" :options="countries" label="Select a country" size="md" />
-    <Select v-model="selected" :options="countries" label="Select a country" size="sm" />
+    <Select v-model:value="selected" :options="countries" label="Select a country" size="lg" />
+    <Select v-model:value="selected" :options="countries" label="Select a country" size="md" />
+    <Select v-model:value="selected" :options="countries" label="Select a country" size="sm" />
   </div>
 </template>
 
diff --git a/docs/components/select/examples/UnderlinedSelect.vue b/docs/components/select/examples/UnderlinedSelect.vue
index 809ac8b..86148db 100644
--- a/docs/components/select/examples/UnderlinedSelect.vue
+++ b/docs/components/select/examples/UnderlinedSelect.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Select v-model="selected" :options="countries" label="Select a country" :underline="true" />
+    <Select v-model:value="selected" :options="countries" label="Select a country" :underline="true" />
   </div>
 </template>
 
diff --git a/src/components/Select/Select.vue b/src/components/Select/Select.vue
index d22cc96..006bb6f 100644
--- a/src/components/Select/Select.vue
+++ b/src/components/Select/Select.vue
@@ -18,7 +18,7 @@ import { toRefs } from 'vue'
 import { useSelectClasses } from '@/components/Select/composables/useSelectClasses'
 
 const props = defineProps({
-  modelValue: {
+  value: {
     default: '',
   },
   label: {
@@ -47,9 +47,9 @@ const props = defineProps({
   },
 })
 
-const emit = defineEmits(['update:modelValue'])
+const emit = defineEmits(['update:value'])
 const handelChange = (event: Event) => {
-  emit('update:modelValue', (event.target as HTMLInputElement).value)
+  emit('update:value', (event.target as HTMLInputElement).value)
 }
 
 const { selectClasses, underlineClasses, labelClasses } = useSelectClasses(toRefs(props))