diff --git a/packages/better-write-app/src/components/editor/project/preferences/EditorProjectPreferencesConfiguration.vue b/packages/better-write-app/src/components/editor/project/preferences/EditorProjectPreferencesConfiguration.vue
index 51e26f77b..4b13becf5 100644
--- a/packages/better-write-app/src/components/editor/project/preferences/EditorProjectPreferencesConfiguration.vue
+++ b/packages/better-write-app/src/components/editor/project/preferences/EditorProjectPreferencesConfiguration.vue
@@ -37,9 +37,10 @@
           :tooltip="t('editor.project.configuration.tooltip.subject')"
         />
       </section>
-      <InputText
+      <InputTextArea
         v-model="PROJECT.subject"
-        class="wb-configuration-input-text"
+        class="wb-configuration-input-text overflow-x-hidden resize-none"
+        rows="5"
       />
     </div>
     <div class="wb-configuration">
diff --git a/packages/better-write-app/src/components/material/InputTextArea.vue b/packages/better-write-app/src/components/material/InputTextArea.vue
new file mode 100644
index 000000000..807de4a71
--- /dev/null
+++ b/packages/better-write-app/src/components/material/InputTextArea.vue
@@ -0,0 +1,29 @@
+<template>
+  <textarea ref="inp" v-model="cmp" :class="css" />
+</template>
+
+<script setup lang="ts">
+  import { ref, computed } from 'vue'
+
+  const props = defineProps({
+    modelValue: {
+      required: true,
+      type: String,
+    },
+    css: {
+      required: false,
+      type: String,
+    },
+  })
+
+  const emit = defineEmits(['update:modelValue'])
+  const inp = ref<HTMLElement | null>(null)
+  const cmp = computed({
+    get() {
+      return props.modelValue
+    },
+    set(val: any) {
+      emit('update:modelValue', val)
+    },
+  })
+</script>