diff --git a/docs/components/collapse.md b/docs/components/collapse.md
index 6ef76159ba..3d7fb77128 100644
--- a/docs/components/collapse.md
+++ b/docs/components/collapse.md
@@ -212,6 +212,36 @@ You may utilize the `trigger-content` slot (to control the anchor text) or the `
 </KCollapse>
 ```
 
+### title
+
+Slot for custom title content.
+
+<KCollapse>
+  <template #title>
+    <KongIcon
+      :color="KUI_COLOR_TEXT_NEUTRAL"
+      :size="KUI_ICON_SIZE_40"
+    />
+    Custom title
+  </template>
+
+  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+</KCollapse>
+
+```html
+<KCollapse>
+  <template #title>
+    <KongIcon
+      :color="KUI_COLOR_TEXT_NEUTRAL"
+      :size="KUI_ICON_SIZE_40"
+    />
+    Custom title
+  </template>
+
+  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+</KCollapse>
+```
+
 ## Events
 
 ### toggle
@@ -225,6 +255,8 @@ Emitted when the `modelValue` is changed.
 <script setup lang="ts">
 import { ref } from 'vue'
 import { HeaderTags } from '@/types'
+import { KongIcon } from '@kong/icons'
+import { KUI_COLOR_TEXT_NEUTRAL, KUI_ICON_SIZE_40 } from '@kong/design-tokens'
 
 const vModelCollapsed = ref<boolean>(true)
 </script>
diff --git a/sandbox/pages/SandboxCollapse.vue b/sandbox/pages/SandboxCollapse.vue
index cd0e76585b..d3821a7c34 100644
--- a/sandbox/pages/SandboxCollapse.vue
+++ b/sandbox/pages/SandboxCollapse.vue
@@ -71,6 +71,40 @@
           This is the hidden content
         </KCollapse>
       </SandboxSectionComponent>
+      <SandboxSectionComponent title="title">
+        <KCollapse>
+          <template #title>
+            Slotted title
+          </template>
+
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+        </KCollapse>
+      </SandboxSectionComponent>
+
+      <!-- Usage -->
+      <SandboxTitleComponent
+        is-subtitle
+        title="Usage"
+      />
+      <SandboxSectionComponent title="Slotted title & cusom trigger">
+        <KCollapse>
+          <template #title>
+            <KongIcon
+              :color="KUI_COLOR_TEXT_NEUTRAL"
+              :size="KUI_ICON_SIZE_40"
+            />
+            Slotted title
+          </template>
+
+          <template #trigger="{ isCollapsed, toggle }">
+            <KButton @click="toggle()">
+              {{ isCollapsed ? 'Expand' : 'Collapse' }}
+            </KButton>
+          </template>
+
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+        </KCollapse>
+      </SandboxSectionComponent>
     </div>
   </SandboxLayout>
 </template>
@@ -79,4 +113,6 @@
 import { inject } from 'vue'
 import SandboxTitleComponent from '../components/SandboxTitleComponent.vue'
 import SandboxSectionComponent from '../components/SandboxSectionComponent.vue'
+import { KongIcon } from '@kong/icons'
+import { KUI_COLOR_TEXT_NEUTRAL, KUI_ICON_SIZE_40 } from '@kong/design-tokens'
 </script>
diff --git a/src/components/KCollapse/KCollapse.cy.ts b/src/components/KCollapse/KCollapse.cy.ts
index 4bde2a5e11..fd9abec499 100644
--- a/src/components/KCollapse/KCollapse.cy.ts
+++ b/src/components/KCollapse/KCollapse.cy.ts
@@ -118,4 +118,22 @@ describe('KCollapse', () => {
     cy.getTestId('collapse-hidden-content').should('be.visible')
     cy.getTestId('collapse-hidden-content').should('contain.text', collapseContent)
   })
+
+  it('renders title slot when using slots', () => {
+    const title = 'Awesome title'
+    const triggerLabel = 'Awesome label'
+    const collapseContent = 'Can you see me?'
+
+    mount(KCollapse, {
+      props: {
+        triggerLabel,
+      },
+      slots: {
+        title: h('div', { 'data-testid': 'custom-title' }, title),
+        default: h('div', {}, collapseContent),
+      },
+    })
+
+    cy.getTestId('custom-title').should('contain.text', title)
+  })
 })
diff --git a/src/components/KCollapse/KCollapse.vue b/src/components/KCollapse/KCollapse.vue
index cdf0aedb6a..e0e5bb51b9 100644
--- a/src/components/KCollapse/KCollapse.vue
+++ b/src/components/KCollapse/KCollapse.vue
@@ -6,11 +6,13 @@
     >
       <component
         :is="titleTag"
-        v-if="title"
+        v-if="title || $slots.title"
         class="collapse-title"
         data-testid="collapse-title"
       >
-        {{ title }}
+        <slot name="title">
+          {{ title }}
+        </slot>
       </component>
       <div class="collapse-trigger">
         <slot
@@ -167,9 +169,12 @@ watch(modelComputed, (newVal, oldVal) => {
     margin-bottom: var(--kui-space-50, $kui-space-50);
 
     .collapse-title {
+      align-items: center;
       color: var(--kui-color-text, $kui-color-text);
+      display: flex;
       font-size: var(--kui-font-size-40, $kui-font-size-40);
       font-weight: var(--kui-font-weight-bold, $kui-font-weight-bold);
+      gap: var(--kui-space-50, $kui-space-50);
       letter-spacing: var(--kui-letter-spacing-minus-30, $kui-letter-spacing-minus-30);
       line-height: var(--kui-line-height-30, $kui-line-height-30);
       margin: var(--kui-space-0, $kui-space-0);
@@ -214,8 +219,13 @@ watch(modelComputed, (newVal, oldVal) => {
     }
 
     &.has-trailing-trigger {
+      align-items: center;
       display: flex;
       justify-content: space-between;
+
+      .collapse-title {
+        margin-bottom: var(--kui-space-0, $kui-space-0);
+      }
     }
   }