diff --git a/docs/components/modal.md b/docs/components/modal.md
index e3e73d7bd1..186800e95b 100644
--- a/docs/components/modal.md
+++ b/docs/components/modal.md
@@ -365,7 +365,6 @@ Use this prop to make modal window take up almost the whole screen. When set to
   @proceed="closeAllModals"
 />
 
-
 ```html
 <KModal
   full-screen
@@ -421,16 +420,112 @@ Whether clicking on backdrop should close the modal (by emitting the [`cancel` e
 
 Options to be passed to [`focus-trap`](https://github.com/focus-trap/focus-trap), which is responsible for trapping focus inside the modal box.
 
+### inputAutofocus
+
+Boolean to control whether KModal should set focus on the first visible input field as soon as modal opens. Defaults to `false`.
+
+<KButton @click="modal16Visible = true">Modal</KButton>
+<KModal
+  input-autofocus
+  title="Modal"
+  :visible="modal16Visible"
+  @cancel="closeAllModals"
+  @proceed="closeAllModals"
+ >
+  <KInput
+    label="Slotted input"
+    :label-attributes="{ info: 'Focus trap set focus on this input field for you as soon as modal opened.' }"
+    required
+  />
+</KModal>
+
+```html
+<KModal
+  input-autofocus
+  title="Modal"
+  :visible="modalVisible"
+  @cancel="handleModalClose"
+  @proceed="handleModalProceed"
+>
+  <KInput
+    label="Slotted input"
+    :label-attributes="{ info: 'Focus trap set focus on this input field for you as soon as modal opened.' }"
+    required
+  />
+</KModal>
+```
+
+:::tip NOTE
+Sometimes you may need to asynchronously fetch data before displaying the form inside a modal. In that case, you can bind `inputAutofocus` to your local loading state variable in order to set `inputAutofocus` prop to `true` as soon as content loads so that KModal could set focus on input fields as soon as they are available.
+
+<KButton @click="modal17Visible = true">Modal</KButton>
+<KModal
+  :input-autofocus="!inputAutofocusContentLoading"
+  title="Modal"
+  :visible="modal17Visible"
+  @cancel="closeAllModals"
+  @proceed="closeAllModals"
+ >
+  <KInput
+    v-if="!inputAutofocusContentLoading"
+    label="Slotted input"
+    :label-attributes="{ info: 'Focus trap set focus on this input field for you as soon as it became available.' }"
+    required
+  />
+  <div
+    v-else
+    class="loading-container"
+  >
+    <ProgressIcon />
+  </div>
+</KModal>
+
+```vue
+<template>
+  <KModal
+    :input-autofocus="!loading"
+    title="Modal"
+    :visible="modalVisible"
+    @cancel="handleModalClose"
+    @proceed="handleModalProceed"
+  >
+    <KInput
+      v-if="!loading"
+      label="Slotted input"
+      :label-attributes="{ info: 'Focus trap set focus on this input field for you as soon as it became available.' }"
+      required
+    />
+    <ProgressIcon v-else />
+  </KModal>
+</template>
+
+<script setup lang="ts">
+const modalVisible = ref<boolean>(false)
+const loading = ref<boolean>(true)
+
+watch(modalVisible, (newValue): void => {
+  if (newValue) {
+    setTimeout(() => {
+      loading.value = false
+    }, 3000)
+  } else {
+    loading.value = true
+  }
+})
+</script>
+```
+:::
+
 ## Slots
 
 ### default
 
 Slot for modal content. Not to be confused with the [`content`](#content) slot which takes presense over all other slots when provided.
 
-<KButton @click="modal16Visible = true">Modal</KButton>
+<KButton @click="modal18Visible = true">Modal</KButton>
 <KModal
   title="Modal"
-  :visible="modal16Visible"
+  :visible="modal18Visible"
   @cancel="closeAllModals"
   @proceed="closeAllModals"
 >
@@ -452,10 +547,10 @@ Slot for modal content. Not to be confused with the [`content`](#content) slot w
 
 Slot for title string.
 
-<KButton @click="modal17Visible = true">Modal</KButton>
+<KButton @click="modal19Visible = true">Modal</KButton>
 <KModal
   title="Title"
-  :visible="modal17Visible"
+  :visible="modal19Visible"
   @cancel="closeAllModals"
   @proceed="closeAllModals"
 >
@@ -481,10 +576,10 @@ Slot for title string.
 
 Slot for footer content.
 
-<KButton @click="modal18Visible = true">Modal</KButton>
+<KButton @click="modal20Visible = true">Modal</KButton>
 <KModal
   title="Title"
-  :visible="modal18Visible"
+  :visible="modal20Visible"
   @cancel="closeAllModals"
   @proceed="closeAllModals"
 >
@@ -510,10 +605,10 @@ Slot for footer content.
 
 Use this slot should you need to provide cusom buttons in modal footer. Ommited when [`footer` slot](#footer) is used.
 
-<KButton @click="modal19Visible = true">Modal</KButton>
+<KButton @click="modal21Visible = true">Modal</KButton>
 <KModal
   title="Title"
-  :visible="modal19Visible"
+  :visible="modal21Visible"
   @cancel="closeAllModals"
   @proceed="closeAllModals"
 >
@@ -573,10 +668,10 @@ By default KModal provides you with the standard layout: modal header (optional)
 Focus-trap requires at least one tabbable element to be present in modal at all times. You can learn more about what elements are considered tabbable [here](https://github.com/focus-trap/tabbable). Make sure your modal has at least one element with non-negative `tabindex` attribute (for example close icon with `role="button"` and `tabindex="0"` attributes). 
 :::
 
-<KButton @click="modal20Visible = true">Modal</KButton>
+<KButton @click="modal22Visible = true">Modal</KButton>
 
 <div class="custom-modal-content">
-  <KModal :visible="modal20Visible" @proceed="closeAllModals">
+  <KModal :visible="modal22Visible" @proceed="closeAllModals">
     <template #content>
       <div class="modal-content">
         <img src="/img/dark-demo.png" alt="Circuit board" />
@@ -647,8 +742,8 @@ Emitted when action button is clicked.
 Emitted when cancel button or close icon (when not hidden) is clicked. 
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { BackIcon, ForwardIcon } from '@kong/icons'
+import { ref, watch } from 'vue'
+import { BackIcon, ForwardIcon, ProgressIcon } from '@kong/icons'
 
 const closeAllModals = () => {
   modal1Visible.value = false
@@ -671,6 +766,8 @@ const closeAllModals = () => {
   modal18Visible.value = false
   modal19Visible.value = false
   modal20Visible.value = false
+  modal21Visible.value = false
+  modal22Visible.value = false
 }
 
 const modal1Visible = ref<boolean>(false)
@@ -693,6 +790,20 @@ const modal17Visible = ref<boolean>(false)
 const modal18Visible = ref<boolean>(false)
 const modal19Visible = ref<boolean>(false)
 const modal20Visible = ref<boolean>(false)
+const modal21Visible = ref<boolean>(false)
+const modal22Visible = ref<boolean>(false)
+
+const inputAutofocusContentLoading = ref<boolean>(true)
+
+watch(modal17Visible, (newValue) => {
+  if (newValue) {
+    setTimeout(() => {
+      inputAutofocusContentLoading.value = false
+    }, 3000)
+  } else {
+    inputAutofocusContentLoading.value = true
+  }
+})
 </script>
 
 <style lang="scss" scoped>
@@ -726,4 +837,9 @@ const modal20Visible = ref<boolean>(false)
     }
   }
 }
+
+.loading-container {
+  display: flex;
+  justify-content: center;
+}
 </style>
\ No newline at end of file
diff --git a/docs/components/prompt.md b/docs/components/prompt.md
index c71cc19a67..69d1d8dbed 100644
--- a/docs/components/prompt.md
+++ b/docs/components/prompt.md
@@ -329,9 +329,14 @@ interface ModalAttributes {
   maxWidth?: string
   maxHeight?: string
   closeOnBackdropClick?: boolean
+  inputAutofocus?: boolean
 }
 ```
 
+:::tip NOTE
+`inputAutofocus` prop defaults to `true` in KPrompt for better UX when `confirmationText` is provided. You can change that simply by setting `inputAutofocus` property to `false` through `modalAttributes` prop.
+:::
+
 <KButton @click="prompt13Visible = true">Prompt</KButton>
 <KPrompt
   :modal-attributes="{ maxWidth: '90%' }"
diff --git a/sandbox/pages/SandboxModals.vue b/sandbox/pages/SandboxModals.vue
index 17c41a44db..4b25a7ce4e 100644
--- a/sandbox/pages/SandboxModals.vue
+++ b/sandbox/pages/SandboxModals.vue
@@ -399,6 +399,45 @@
           </KModal>
         </KComponent>
       </SandboxSectionComponent>
+      <SandboxSectionComponent title="inputAutofocus">
+        <KComponent
+          v-slot="{ data }"
+          :data="{ modalVisible: false, inputAutofocus: false }"
+        >
+          <div class="vertical-container">
+            <div>
+              <KButton
+                @click="data.modalVisible = true"
+              >
+                KModal
+              </KButton>
+            </div>
+            <KInputSwitch
+              v-model="data.inputAutofocus"
+              label="Input autofocus"
+            />
+          </div>
+
+          <KModal
+            :input-autofocus="data.inputAutofocus"
+            title="KModal autofocus"
+            :visible="data.modalVisible"
+            @cancel="data.modalVisible = false"
+            @proceed="data.modalVisible = false"
+          >
+            <div class="vertical-container">
+              <KInput
+                label="Readonly input"
+                readonly
+              />
+              <KInput
+                label="Focusable input"
+                :label-attributes="{ info: 'KModal set focus on this input field for you as soon as modal opened.' }"
+              />
+            </div>
+          </KModal>
+        </KComponent>
+      </SandboxSectionComponent>
 
       <!-- Slots -->
       <SandboxTitleComponent
@@ -597,16 +636,55 @@
           </KModal>
         </KComponent>
       </SandboxSectionComponent>
+      <SandboxSectionComponent title="inputAutofocus & loading content">
+        <KButton @click="inputAutofocusModalVisible = true">
+          KModal
+        </KButton>
+
+        <KModal
+          :input-autofocus="!inputAutofocusContentLoading"
+          title="KModal autofocus"
+          :visible="inputAutofocusModalVisible"
+          @cancel="inputAutofocusModalVisible = false"
+          @proceed="inputAutofocusModalVisible = false"
+        >
+          <KInput
+            v-if="!inputAutofocusContentLoading"
+            label="Slotted input"
+            :label-attributes="{ info: 'Focus trap set focus on this input field for you as soon as modal opened.' }"
+            required
+          />
+          <div
+            v-else
+            class="loading-container"
+          >
+            <ProgressIcon />
+          </div>
+        </KModal>
+      </SandboxSectionComponent>
     </div>
   </SandboxLayout>
 </template>
 
 <script setup lang="ts">
-import { inject } from 'vue'
+import { inject, ref, watch } from 'vue'
 import SandboxTitleComponent from '../components/SandboxTitleComponent.vue'
 import SandboxSectionComponent from '../components/SandboxSectionComponent.vue'
-import { KongIcon } from '@kong/icons'
+import { KongIcon, ProgressIcon } from '@kong/icons'
 import { KUI_COLOR_TEXT_DECORATIVE_AQUA } from '@kong/design-tokens'
+
+const inputAutofocusModalVisible = ref<boolean>(false)
+const inputAutofocusContentLoading = ref<boolean>(true)
+
+watch(inputAutofocusModalVisible, (newValue): void => {
+  if (newValue) {
+    setTimeout(() => {
+      inputAutofocusContentLoading.value = false
+    }, 3000)
+  } else {
+    inputAutofocusContentLoading.value = true
+  }
+})
 </script>
 
 <style lang="scss" scoped>
@@ -621,5 +699,10 @@ import { KUI_COLOR_TEXT_DECORATIVE_AQUA } from '@kong/design-tokens'
     flex-direction: column;
     gap: $kui-space-50;
   }
+
+  .loading-container {
+    display: flex;
+    justify-content: center;
+  }
 }
 </style>
diff --git a/src/components/KModal/KModal.cy.ts b/src/components/KModal/KModal.cy.ts
index 6c4c972651..b3e10e84d8 100644
--- a/src/components/KModal/KModal.cy.ts
+++ b/src/components/KModal/KModal.cy.ts
@@ -272,4 +272,18 @@ describe('KModal', () => {
       cy.wrap(Cypress.vueWrapper.emitted()).should('have.property', 'cancel').and('have.length', 1)
     })
   })
+
+  it('sets focus on first input field when inputAutofocus is true', () => {
+    mount(KModal, {
+      props: {
+        visible: true,
+        inputAutofocus: true,
+      },
+      slots: {
+        default: '<input data-testid="slotted-input" type="text" />',
+      },
+    })
+
+    cy.get('.k-modal input[data-testid="slotted-input"]').should('have.focus')
+  })
 })
diff --git a/src/components/KModal/KModal.vue b/src/components/KModal/KModal.vue
index a9514a5325..6582b575e3 100644
--- a/src/components/KModal/KModal.vue
+++ b/src/components/KModal/KModal.vue
@@ -23,6 +23,7 @@
         <div
           class="modal-container"
           :class="{ 'custom-content': $slots['content'] }"
+          tabindex="-1"
         >
           <slot name="content">
             <div
@@ -167,6 +168,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  inputAutofocus: {
+    type: Boolean,
+    default: false,
+  },
 })
 
 const emit = defineEmits<{
@@ -241,9 +246,28 @@ const toggleEventListeners = (isActive: boolean): void => {
   }
 }
 
+const setInputAutofocus = (): void => {
+  const allInputs = focusTrapElement.value?.$el?.querySelector('.modal-content')?.querySelectorAll('input')
+  if (allInputs?.length) {
+    // loop through all inputs and focus on the first one that is not disabled or read-only
+    Array.from(allInputs).every((input: any) => {
+      if (!input.disabled && !input.readOnly) {
+        input.focus() // set focus
+
+        return false // exit the loop
+      }
+
+      return true // continue going through the loop until we find a focusable input (or run out of inputs)
+    })
+  }
+}
+
 watch(() => props.visible, async (visible: boolean): Promise<void> => {
   if (visible) {
     await toggleFocusTrap(true)
+    if (props.inputAutofocus) {
+      setInputAutofocus()
+    }
     toggleBodyScroll(false)
     toggleEventListeners(true)
   } else {
@@ -253,6 +277,13 @@ watch(() => props.visible, async (visible: boolean): Promise<void> => {
   }
 }, { immediate: true })
 
+watch(() => props.inputAutofocus, async (inputAutofocus: boolean): Promise<void> => {
+  if (inputAutofocus) {
+    await nextTick() // wait for the modal content to be rendered
+    setInputAutofocus()
+  }
+})
+
 onUnmounted(() => {
   toggleEventListeners(false)
 })
@@ -278,7 +309,7 @@ onUnmounted(() => {
       align-items: center;
       padding-top: var(--kui-space-0, $kui-space-0);
 
-      .modal-container {
+      > .modal-container {
         display: flex;
         flex-direction: column;
         height: 95vh;
diff --git a/src/components/KPrompt/KPrompt.vue b/src/components/KPrompt/KPrompt.vue
index e1629f14dc..5e6dca389c 100644
--- a/src/components/KPrompt/KPrompt.vue
+++ b/src/components/KPrompt/KPrompt.vue
@@ -1,6 +1,6 @@
 <template>
   <KModal
-    v-bind="{ ...sanitizedAttrs, ...modalAttributes}"
+    v-bind="{ ...sanitizedAttrs, ...modalAttributes }"
     :action-button-appearance="actionButtonAppearance"
     :action-button-disabled="actionButtonDisabledValue"
     :action-button-text="actionButtonText"
@@ -8,6 +8,7 @@
     :cancel-button-disabled="cancelButtonDisabled"
     :cancel-button-text="cancelButtonText"
     class="k-prompt"
+    :input-autofocus="modalAttributes.inputAutofocus === undefined ? true : modalAttributes.inputAutofocus"
     :title="title || 'Confirm your action'"
     :visible="visible"
     @cancel="$emit('cancel')"
@@ -127,6 +128,7 @@ const sanitizedAttrs = computed(() => {
   delete attributes['max-width']
   delete attributes['max-height']
   delete attributes['close-on-backdrop-click']
+  delete attributes['input-autofocus']
   // delete KModal props that are not available in KPrompt
   delete attributes['hide-close-icon']
   delete attributes['hide-cancel-button']
diff --git a/src/types/prompt.ts b/src/types/prompt.ts
index 0d91c78fc5..cc550d64da 100644
--- a/src/types/prompt.ts
+++ b/src/types/prompt.ts
@@ -3,4 +3,5 @@ export interface ModalAttributes {
   maxWidth?: string
   maxHeight?: string
   closeOnBackdropClick?: boolean
+  inputAutofocus?: boolean
 }