diff --git a/.github/skills/changeset-decision/SKILL.md b/.agents/skills/changeset-decision/SKILL.md
similarity index 100%
rename from .github/skills/changeset-decision/SKILL.md
rename to .agents/skills/changeset-decision/SKILL.md
diff --git a/.github/skills/create-changeset/SKILL.md b/.agents/skills/create-changeset/SKILL.md
similarity index 100%
rename from .github/skills/create-changeset/SKILL.md
rename to .agents/skills/create-changeset/SKILL.md
diff --git a/.agents/skills/sdd/SKILL.md b/.agents/skills/sdd/SKILL.md
new file mode 100644
index 00000000000..85a7ac626c4
--- /dev/null
+++ b/.agents/skills/sdd/SKILL.md
@@ -0,0 +1,277 @@
+---
+name: sdd
+description: >-
+  Spec-Driven Development for Siemens IX: turns user-provided issue or tracking text
+  into spec.md, plan.md, and tasks.md (GitHub spec-kit style, size-aware, no tracker integration).
+  Use when the user asks for SDD, spec-kit planning, or structured feature docs from issue text
+  (e.g. IX-1234 plus pasted description). Outputs live under .sdd/{tracking-id}/.
+argument-hint: 'Tracking/issue id (e.g. IX-3896) and pasted title, description, acceptance criteria'
+user-invocable: true
+---
+
+# Spec-Driven Development (IX)
+
+## Overview
+
+Transform **user-provided issue or tracking text** (no tracker integration required) into structured specifications following **GitHub spec-kit methodology**: clear separation, progressive disclosure, minimal duplication.
+
+**When to use**: User wants SDD / spec planning for an IX change and supplies (or will supply) a tracking/issue identifier plus title, description, and acceptance criteria as plain text.
+
+## Required input (no tracker integration)
+
+Before Phase 1, confirm you have:
+
+1. **Tracking/issue identifier** (e.g. `IX-3896`, issue number, ticket key) — if missing, ask once; if still missing, derive a short folder slug from the title (lowercase, hyphens, max ~40 chars).
+2. **Issue title** (summary line).
+3. **Description** — user story, context, bullets, links as pasted.
+4. **Acceptance criteria** — pasted AC block or checklist from the issue/tracking source.
+
+If the user only pastes prose without clear AC, extract implied AC into the spec and add a **Clarifications** note listing assumptions.
+
+**Do not** call tracker APIs or assume an MCP; treat the chat message as the source of truth.
+
+## Key principles
+
+1. **Separation**: `spec.md` (WHAT), `plan.md` (HOW), `tasks.md` (DO) — no duplication.
+2. **Tech-agnostic specs**: Requirements do not name Stencil/React/etc.
+3. **Size-aware output**: XS compact; L fuller (see below).
+4. **Line limits**: Each artifact file under 500 lines.
+5. **Progressive disclosure**: Read spec → plan → tasks when implementing.
+
+## Workflow phases
+
+```
+Pasted issue text → Specify → Review → Clarify → Review → Plan → Review → Tasks → Review → Implement
+                    ↓                  ↓                 ↓                ↓
+                  spec.md            spec.md           plan.md          tasks.md
+```
+
+**Mandatory phase gates**:
+
+After creating or updating each artifact, stop and ask the user to review the created file before continuing:
+
+1. After `spec.md`: ask whether to continue to planning or revise the spec.
+2. After updated `spec.md` clarifications: ask whether to continue to planning or revise the clarified spec.
+3. After `plan.md`: ask whether to continue to task breakdown or revise the plan.
+4. After `tasks.md`: ask whether to implement, revise tasks, or stop at handoff.
+
+Do **not** proceed to the next phase automatically after writing an artifact. If the runtime provides an `ask_user` tool, use it for these phase gates instead of asking in plain text.
+
+If the XS strategy omits `spec.md` or `tasks.md`, skip only the omitted file's review gate; still stop after the merged `plan.md` and ask the user to review it before implementation.
+
+### Phase 1: Specify (requirements)
+
+Create `spec.md` from the pasted issue only (optional: spawn a read-only explore subagent for codebase context **after** spec is drafted if gaps exist — do not block spec on repo-wide search).
+
+**Output path**: `.sdd/{TRACKING_ID}/spec.md` (use the agreed tracking/issue identifier or slug for `{TRACKING_ID}`).
+
+**Review gate**: After writing `spec.md`, stop and ask the user to review `.sdd/{TRACKING_ID}/spec.md`. Continue only when the user approves moving to planning; otherwise revise `spec.md` first.
+
+**Frontmatter**:
+
+```yaml
+---
+tracking_id: {ID or slug}
+feature: {TITLE}
+date: {ISO date}
+status: ready-for-planning
+source: user-pasted-issue
+---
+```
+
+**Body template** (adapt length to size tier):
+
+```markdown
+# Feature Spec: {TITLE}
+
+## User input (from issue)
+{2–5 lines summarizing pasted description — no copy-paste dump of entire ticket}
+
+## User scenarios and testing
+
+### US1 [P1] - {Scenario}
+**As** {role}
+**I want** {goal}
+**So that** {benefit}
+
+**Acceptance scenarios:**
+**Given** {context}
+**When** {action}
+**Then** {outcome}
+
+**Edge cases:** {if any}
+
+## Requirements
+
+### Functional requirements
+**FR-001**: {requirement}
+**FR-002**: {requirement}
+
+### Key entities
+{Only if data or domain models matter}
+
+## Success criteria
+**SC-001**: {measurable outcome}
+**SC-002**: {measurable outcome}
+
+## Assumptions
+{Scope boundaries, dependencies on other IX areas}
+```
+
+**Size guide (spec.md only)**:
+
+- XS: ~40 lines
+- S: ~80 lines
+- M: ~100 lines
+- L: ~150 lines
+
+### Phase 2: Clarify (optional)
+
+If requirements are ambiguous, ask targeted questions in chat; when answered, append to `spec.md`:
+
+```markdown
+## Clarifications
+
+**Q1**: …
+**A**: …
+```
+
+**Review gate**: After adding clarifications, stop and ask the user to review the updated `.sdd/{TRACKING_ID}/spec.md`. Continue only when the user approves moving to planning; otherwise revise `spec.md` first.
+
+### Phase 3: Plan (technical approach)
+
+**Output**: `.sdd/{TRACKING_ID}/plan.md`
+
+1. Read `spec.md`.
+2. Align with IX repo: skim `CONTRIBUTING.md` and relevant package/component paths touched; follow existing patterns in the monorepo.
+3. Record technical decisions with short rationale; **do not** repeat requirements from `spec.md` — reference them (`See spec.md US1`).
+
+**Plan frontmatter**:
+
+```yaml
+---
+tracking_id: {ID or slug}
+phase: plan
+created: {ISO date}
+depends_on: []
+---
+```
+
+**Sections**: Summary, Technical context (language, packages, tests), Architecture (decisions with alternatives rejected), Implementation structure, Risks and mitigations, Deployment strategy only if non-trivial.
+
+**Review gate**: After writing `plan.md`, stop and ask the user to review `.sdd/{TRACKING_ID}/plan.md`. Continue only when the user approves creating tasks; otherwise revise `plan.md` first.
+
+**Size guide (plan.md)**:
+
+- XS: merge spec + plan into a **single** `plan.md` only (~80 lines total) — skip separate `spec.md` only when doing XS merge (see XS strategy below).
+- S: ~120 lines
+- M: ~150 lines
+- L: ~200 lines
+
+### Phase 4: Tasks (implementation steps)
+
+**Output**: `.sdd/{TRACKING_ID}/tasks.md`
+
+Ordered steps; each task: id, file path in repo, action, optional snippet, dependencies. Mark parallelizable tasks with `[P]`. Do not repeat plan rationale.
+
+**Review gate**: After writing `tasks.md`, stop and ask the user to review `.sdd/{TRACKING_ID}/tasks.md`. Implement only if the user explicitly approves implementation; otherwise revise `tasks.md` or stop at handoff.
+
+**Size guide (tasks.md)**:
+
+- XS: omit `tasks.md` (implement from merged plan).
+- S: ~100 lines
+- M: ~150 lines
+- L: ~200 lines
+
+### Phase 5: Research (optional)
+
+Create `research.md` only for unusual dependency or API verification — not for routine Stencil/Playwright usage.
+
+**Output**: `.sdd/{TRACKING_ID}/research.md` (<300 lines).
+
+## XS output strategy
+
+For **XS** (<~2h) work:
+
+- Produce **one** file: `.sdd/{TRACKING_ID}/plan.md` (~80 lines) that merges concise requirements + approach + minimal task list + validation checklist.
+- Omit separate `spec.md` / `tasks.md` unless the user explicitly wants full spec-kit layout.
+- Stop after writing the merged `plan.md` and ask the user to review it before implementation.
+
+## S / M / L output strategy
+
+| Tier | Outputs | Approx. total lines |
+|------|---------|---------------------|
+| S | spec.md + plan.md + tasks.md | ~300 |
+| M | spec.md + plan.md + tasks.md | ~400 |
+| L | spec.md + plan.md + tasks.md (+ optional research.md) | ~600 |
+
+Classify size from pasted story points, AC count, and breadth (single component vs cross-package).
+
+## Anti-duplication rules
+
+Before each paragraph:
+
+1. Already in `spec.md`? → Link, do not repeat.
+2. Technical decision? → `plan.md` only.
+3. Implementation step? → `tasks.md` only.
+4. Obvious to an IX maintainer? → Skip (standard monorepo test commands, changeset rules — point to existing skills if needed).
+5. Project-wide rule? → Reference `CONTRIBUTING.md` or the relevant package README.
+
+**Cross-reference pattern**:
+
+```markdown
+See spec.md US1 for acceptance criteria.
+See plan.md Architecture for rationale.
+```
+
+## File layout
+
+```text
+.sdd/{TRACKING_ID}/
+├── spec.md       # Requirements (tech-agnostic)
+├── plan.md       # Technical approach
+├── tasks.md      # Implementation steps
+└── research.md   # Optional tech verification
+```
+
+Do **not** generate `narrative.md` or standalone `alternatives.md` — keep decisions inline in `plan.md`.
+
+## Context management
+
+- **Main chat**: clarify scope, write `plan.md` / `tasks.md`, discuss trade-offs.
+- **Read-only exploration**: large codebase search to ground `plan.md` paths — use sparingly after `spec.md` exists.
+
+## Implementation handoff
+
+When artifacts are ready:
+
+```text
+Specification complete for {TRACKING_ID}.
+
+Files:
+- spec.md — requirements
+- plan.md — technical approach
+- tasks.md — steps (if created)
+
+Next: implement a task, all tasks in order, or revise the plan — say which you prefer.
+```
+
+## Quality checklist
+
+**spec.md**: Tech-agnostic; Given/When/Then where applicable; numbered FRs; measurable success criteria; <500 lines.
+
+**plan.md**: No requirement duplication; decisions with 1–2 line rationale; references spec; IX-realistic paths; <500 lines.
+
+**tasks.md**: Exact repo paths; dependency order; `[P]` for parallel; no decision essays; <500 lines.
+
+**Overall**: No cross-file duplication; size tier matches work; each file has one job.
+
+## IX-specific notes
+
+- Prefer paths under `packages/core`, `packages/angular`, `packages/react`, `packages/documentation`, etc., as appropriate — discover real paths from the tree, do not invent directories.
+- Testing and release hygiene: use existing project skills (component tests, Storybook a11y, changesets) when the user’s workflow requires them; do not restate full skill bodies here.
+
+## References
+
+- [GitHub spec-kit](https://github.com/github/spec-kit)
+- Project skill definition: `.github/skills/sdd/SKILL.md` — this repo skill uses pasted issue/tracking text and `.sdd/…` for generated artifacts.
diff --git a/.changeset/chat-input-component.md b/.changeset/chat-input-component.md
new file mode 100644
index 00000000000..4b553b8f5a3
--- /dev/null
+++ b/.changeset/chat-input-component.md
@@ -0,0 +1,5 @@
+---
+'@siemens/ix': minor
+---
+
+Add the `ix-chat-input` component for AI prompt entry, including multiline input behavior, attachment support with `ix-chat-prompt-attachment`, action slots, submit handling, processing state, threshold-based character limit guidance, form integration, and disclaimer text.
diff --git a/.changeset/chat-user-message-component.md b/.changeset/chat-user-message-component.md
new file mode 100644
index 00000000000..c6da0e827e6
--- /dev/null
+++ b/.changeset/chat-user-message-component.md
@@ -0,0 +1,5 @@
+---
+'@siemens/ix': minor
+---
+
+Add the `ix-chat` component for composing chat layouts with messages and a chat input, add the `ix-chat-user-message` component for displaying right-aligned user messages in chat interfaces with optional contextual actions and sent attachments, and add the `ix-chat-ai-message` component for displaying slotted AI-generated responses with optional actions and sources. The existing `ix-chat-prompt-attachment` component now renders with `ix-chip`, supports a compact `sent` variant, supports preview-enabled attachments with `previewSupported`, emits `attachmentClick` only for those preview interactions, and no longer exposes a retry action for failed attachments. `ix-chat-input` can display prompt attachments and now provides a `follow-up` slot for follow-up prompt actions.
diff --git a/.changeset/chip-inactive-close-button.md b/.changeset/chip-inactive-close-button.md
new file mode 100644
index 00000000000..71ca52d7dd8
--- /dev/null
+++ b/.changeset/chip-inactive-close-button.md
@@ -0,0 +1,5 @@
+---
+'@siemens/ix': patch
+---
+
+Fix `ix-chip` so closable chips still render an interactive close button when `inactive` is set without overlapping or breaking text truncation.
diff --git a/.gitignore b/.gitignore
index b464aa7dd0f..2f4f39ff51d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -30,6 +30,7 @@ node_modules
 
 # misc
 .turbo
+/.sdd/
 /.sass-cache
 /connect.lock
 /coverage
diff --git a/ARCHITECTURE.md b/ARCHITECTURE.md
index fdb45fd2d17..259be4c381d 100644
--- a/ARCHITECTURE.md
+++ b/ARCHITECTURE.md
@@ -75,6 +75,14 @@ Supporting roots:
 | Generate Changeset         | `pnpm changeset`                                               | Add semver intent (patch/minor/major)     |
 | Docs Sync (examples)       | Build + run docs pipeline                                      | Examples auto-generated from test apps    |
 
+### Framework Tests and Preview Examples
+
+`packages/html-test-app/src/preview-examples/*.html` is the source list for framework test IDs. When adding or renaming an HTML preview example, run `pnpm --filter framework-tests build` from the repository root before adding or validating matching Angular, React, or Vue preview variants.
+
+The build regenerates files under `testing/framework-tests/tests/generated/`, including `test-ids.autogenerated.ts`, snapshot tests, axe tests, and generated indexes. Do not hand-edit generated files; update `testing/framework-tests/src/main.ts` instead if generation behavior needs to change.
+
+Preview example changes can affect accessibility tree snapshots in `testing/framework-tests/__snapshots__/*.yaml`. Add or update the matching `*-aria-snapshot.yaml` files when a generated snapshot test changes.
+
 ### Stencil Build Outputs
 
 - `dist/` bundles
diff --git a/package.json b/package.json
index 938fb341ab5..0b5ade4aaed 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,6 @@
     "test.setup": "dotenv -- turbo run test.setup --concurrency=1",
     "prepare": "pnpm disable-telemetry",
     "disable-telemetry": "turbo telemetry disable",
-    "compare-examples": "node ./scripts/compare-preview-examples-across-test-apps.js",
     "ci:version": "pnpm changeset version && pnpm i --lockfile-only",
     "ci:publish": "pnpm changeset publish",
     "ts-run": "tsx"
diff --git a/packages/angular-standalone-test-app/src/app/app.routes.ts b/packages/angular-standalone-test-app/src/app/app.routes.ts
index cfc4e9e9af6..2ac935e3710 100644
--- a/packages/angular-standalone-test-app/src/app/app.routes.ts
+++ b/packages/angular-standalone-test-app/src/app/app.routes.ts
@@ -98,6 +98,14 @@ export const routePaths: IxPreviewRoutes = {
     import('../preview-examples/category-filter-suggestions').then(
       (m) => m.default
     ),
+  'preview/chat': () =>
+    import('../preview-examples/chat').then((m) => m.default),
+  'preview/chat-ai-message': () =>
+    import('../preview-examples/chat-ai-message').then((m) => m.default),
+  'preview/chat-input': () =>
+    import('../preview-examples/chat-input').then((m) => m.default),
+  'preview/chat-user-message': () =>
+    import('../preview-examples/chat-user-message').then((m) => m.default),
   'preview/checkbox': () =>
     import('../preview-examples/checkbox').then((m) => m.default),
   'preview/checkbox-indeterminate': () =>
@@ -123,9 +131,7 @@ export const routePaths: IxPreviewRoutes = {
   'preview/date-dropdown': () =>
     import('../preview-examples/date-dropdown').then((m) => m.default),
   'preview/date-dropdown-presets': () =>
-    import('../preview-examples/date-dropdown-presets').then(
-      (m) => m.default
-    ),
+    import('../preview-examples/date-dropdown-presets').then((m) => m.default),
   'preview/date-range': () =>
     import('../preview-examples/date-range').then((m) => m.default),
   'preview/datetime-range': () =>
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.html b/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.html
new file mode 100644
index 00000000000..ad416157fc1
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.html
@@ -0,0 +1,55 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-ai-message>
+    <h3>Recommended maintenance actions</h3>
+    <p>
+      The compressor is operating within the expected range. Schedule the next
+      inspection during the Friday service window and keep monitoring the
+      vibration trend.
+    </p>
+    <ul>
+      <li>Review the acknowledged alarms from the last shift.</li>
+      <li>Confirm that spare parts are available before the service window.</li>
+      <li>Share the summary with the maintenance lead.</li>
+    </ul>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy response"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Helpful response"
+      icon="thumb-up"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Not helpful response"
+      icon="thumb-down"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Regenerate response"
+      icon="refresh"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-chip slot="sources" icon="globe" outline variant="neutral">
+      Sources
+    </ix-chip>
+  </ix-chat-ai-message>
+</ix-chat>
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.ts b/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.ts
new file mode 100644
index 00000000000..2228a54d5c2
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-ai-message.ts
@@ -0,0 +1,41 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import {
+  IxChat,
+  IxChatAiMessage,
+  IxChip,
+  IxIconButton,
+} from '@siemens/ix-angular/standalone';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconGlobe,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: './chat-ai-message.html',
+  imports: [IxChat, IxChatAiMessage, IxChip, IxIconButton],
+})
+export default class ChatAiMessage {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconGlobe,
+      iconRefresh,
+      iconThumbDown,
+      iconThumbUp,
+    });
+  }
+}
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-input.html b/packages/angular-standalone-test-app/src/preview-examples/chat-input.html
new file mode 100644
index 00000000000..0f3f95f58d2
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-input.html
@@ -0,0 +1,46 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-input
+    slot="prompt"
+    value="Check open alarms and suggest the next maintenance step."
+    placeholder="Ask about asset status..."
+    textarea-label="Service assistant prompt"
+    max-length="180"
+    character-limit="180"
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="shift_report.pdf"
+      icon="pdf-document"
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="start"
+      aria-label="Attach file"
+      icon="attach"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="end"
+      aria-label="Add image"
+      icon="image"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="end"
+      aria-label="Record voice input"
+      icon="microphone"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-input>
+</ix-chat>
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-input.ts b/packages/angular-standalone-test-app/src/preview-examples/chat-input.ts
new file mode 100644
index 00000000000..d0d45be3fc0
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-input.ts
@@ -0,0 +1,39 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import {
+  IxChat,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxIconButton,
+} from '@siemens/ix-angular/standalone';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconAttach,
+  iconImage,
+  iconMicrophone,
+  iconPdfDocument,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: './chat-input.html',
+  imports: [IxChat, IxChatInput, IxChatPromptAttachment, IxIconButton],
+})
+export default class ChatInput {
+  constructor() {
+    addIcons({
+      iconAttach,
+      iconImage,
+      iconMicrophone,
+      iconPdfDocument,
+    });
+  }
+}
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.html b/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.html
new file mode 100644
index 00000000000..1532c2470ff
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.html
@@ -0,0 +1,46 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-user-message message="Summarize the attached shift report.">
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="shift_report.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="operator_notes.txt"
+      icon="txt-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy message"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Edit message"
+      icon="pen"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Show more actions"
+      icon="more-menu"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-user-message>
+</ix-chat>
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.ts b/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.ts
new file mode 100644
index 00000000000..dc4bc81090a
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat-user-message.ts
@@ -0,0 +1,41 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import {
+  IxChat,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxIconButton,
+} from '@siemens/ix-angular/standalone';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: './chat-user-message.html',
+  imports: [IxChat, IxChatPromptAttachment, IxChatUserMessage, IxIconButton],
+})
+export default class ChatUserMessage {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconMoreMenu,
+      iconPdfDocument,
+      iconPen,
+      iconTxtDocument,
+    });
+  }
+}
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat.html b/packages/angular-standalone-test-app/src/preview-examples/chat.html
new file mode 100644
index 00000000000..3b411a67615
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat.html
@@ -0,0 +1,117 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-user-message
+    message="Summarize the asset status and include the attached maintenance files."
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="equipment_status.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="maintenance_notes.txt"
+      icon="txt-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy message"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Edit message"
+      icon="pen"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Show more actions"
+      icon="more-menu"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-user-message>
+
+  <ix-chat-ai-message>
+    <h3>Asset performance summary</h3>
+    <p>
+      The compressor train is operating inside the expected range. Vibration
+      increased slightly after the last shift change, but all values remain
+      below the warning threshold.
+    </p>
+    <ul class="message-list">
+      <li>Temperature trend is stable over the last 24 hours.</li>
+      <li>Two alarms were acknowledged by the operator.</li>
+      <li>Next service window is scheduled for Friday.</li>
+    </ul>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy response"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Helpful response"
+      icon="thumb-up"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Not helpful response"
+      icon="thumb-down"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Regenerate response"
+      icon="refresh"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-chip slot="sources" icon="globe" outline variant="neutral">
+      Sources
+    </ix-chip>
+  </ix-chat-ai-message>
+
+  <ix-chat-user-message
+    message="Compare the current report with additional customer feedback."
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="customer_feedback.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+  </ix-chat-user-message>
+
+  <ix-chat-ai-message>
+    <p>
+      Customer feedback confirms the same maintenance priorities. The next step
+      is to validate spare-part availability and confirm the planned downtime
+      window.
+    </p>
+  </ix-chat-ai-message>
+
+  <ix-chat-input
+    slot="prompt"
+    value="Create a concise follow-up plan for the service team."
+  ></ix-chat-input>
+</ix-chat>
diff --git a/packages/angular-standalone-test-app/src/preview-examples/chat.ts b/packages/angular-standalone-test-app/src/preview-examples/chat.ts
new file mode 100644
index 00000000000..a959822995c
--- /dev/null
+++ b/packages/angular-standalone-test-app/src/preview-examples/chat.ts
@@ -0,0 +1,60 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import {
+  IxChat,
+  IxChatAiMessage,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxChip,
+  IxIconButton,
+} from '@siemens/ix-angular/standalone';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconGlobe,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: './chat.html',
+  imports: [
+    IxChat,
+    IxChatAiMessage,
+    IxChatInput,
+    IxChatPromptAttachment,
+    IxChatUserMessage,
+    IxChip,
+    IxIconButton,
+  ],
+})
+export default class Chat {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconGlobe,
+      iconMoreMenu,
+      iconPdfDocument,
+      iconPen,
+      iconRefresh,
+      iconThumbDown,
+      iconThumbUp,
+      iconTxtDocument,
+    });
+  }
+}
diff --git a/packages/angular-test-app/src/app/app-routing.module.ts b/packages/angular-test-app/src/app/app-routing.module.ts
index 4c527201f37..8edea4a6934 100644
--- a/packages/angular-test-app/src/app/app-routing.module.ts
+++ b/packages/angular-test-app/src/app/app-routing.module.ts
@@ -47,6 +47,10 @@ import Card from '../preview-examples/card';
 import CardList from '../preview-examples/card-list';
 import CategoryFilter from '../preview-examples/category-filter';
 import CategoryFilterSuggestions from '../preview-examples/category-filter-suggestions';
+import Chat from '../preview-examples/chat';
+import ChatAiMessage from '../preview-examples/chat-ai-message';
+import ChatInput from '../preview-examples/chat-input';
+import ChatUserMessage from '../preview-examples/chat-user-message';
 import Checkbox from '../preview-examples/checkbox';
 import CheckboxIndeterminate from '../preview-examples/checkbox-indeterminate';
 import Chip from '../preview-examples/chip';
@@ -417,6 +421,22 @@ const routes: Routes = [
         path: 'category-filter',
         component: CategoryFilter,
       },
+      {
+        path: 'chat',
+        component: Chat,
+      },
+      {
+        path: 'chat-ai-message',
+        component: ChatAiMessage,
+      },
+      {
+        path: 'chat-input',
+        component: ChatInput,
+      },
+      {
+        path: 'chat-user-message',
+        component: ChatUserMessage,
+      },
       {
         path: 'checkbox-indeterminate',
         component: CheckboxIndeterminate,
diff --git a/packages/angular-test-app/src/app/app.module.ts b/packages/angular-test-app/src/app/app.module.ts
index 20fed4fbb1a..10da935d48a 100644
--- a/packages/angular-test-app/src/app/app.module.ts
+++ b/packages/angular-test-app/src/app/app.module.ts
@@ -56,6 +56,10 @@ import Card from '../preview-examples/card';
 import CardList from '../preview-examples/card-list';
 import CategoryFilter from '../preview-examples/category-filter';
 import CategoryFilterSuggestions from '../preview-examples/category-filter-suggestions';
+import Chat from '../preview-examples/chat';
+import ChatAiMessage from '../preview-examples/chat-ai-message';
+import ChatInput from '../preview-examples/chat-input';
+import ChatUserMessage from '../preview-examples/chat-user-message';
 import Checkbox from '../preview-examples/checkbox';
 import CheckboxIndeterminate from '../preview-examples/checkbox-indeterminate';
 import Chip from '../preview-examples/chip';
@@ -311,6 +315,10 @@ import WorkflowVertical from '../preview-examples/workflow-vertical';
     CardList,
     CategoryFilterSuggestions,
     CategoryFilter,
+    Chat,
+    ChatAiMessage,
+    ChatInput,
+    ChatUserMessage,
     CheckboxIndeterminate,
     Checkbox,
     Chip,
diff --git a/packages/angular-test-app/src/preview-examples/chat-ai-message.html b/packages/angular-test-app/src/preview-examples/chat-ai-message.html
new file mode 100644
index 00000000000..ad416157fc1
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-ai-message.html
@@ -0,0 +1,55 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-ai-message>
+    <h3>Recommended maintenance actions</h3>
+    <p>
+      The compressor is operating within the expected range. Schedule the next
+      inspection during the Friday service window and keep monitoring the
+      vibration trend.
+    </p>
+    <ul>
+      <li>Review the acknowledged alarms from the last shift.</li>
+      <li>Confirm that spare parts are available before the service window.</li>
+      <li>Share the summary with the maintenance lead.</li>
+    </ul>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy response"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Helpful response"
+      icon="thumb-up"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Not helpful response"
+      icon="thumb-down"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Regenerate response"
+      icon="refresh"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-chip slot="sources" icon="globe" outline variant="neutral">
+      Sources
+    </ix-chip>
+  </ix-chat-ai-message>
+</ix-chat>
diff --git a/packages/angular-test-app/src/preview-examples/chat-ai-message.ts b/packages/angular-test-app/src/preview-examples/chat-ai-message.ts
new file mode 100644
index 00000000000..ff9e28f4847
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-ai-message.ts
@@ -0,0 +1,35 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconGlobe,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  standalone: false,
+  selector: 'app-example',
+  templateUrl: './chat-ai-message.html',
+})
+export default class ChatAiMessage {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconGlobe,
+      iconRefresh,
+      iconThumbDown,
+      iconThumbUp,
+    });
+  }
+}
diff --git a/packages/angular-test-app/src/preview-examples/chat-input.html b/packages/angular-test-app/src/preview-examples/chat-input.html
new file mode 100644
index 00000000000..d7792c799d0
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-input.html
@@ -0,0 +1,46 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-input
+    slot="prompt"
+    value="Check open alarms and suggest the next maintenance step."
+    placeholder="Ask about asset status..."
+    textarea-label="Service assistant prompt"
+    max-length="180"
+    character-limit="180"
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="shift_report.pdf"
+      icon="pdf-document"
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="start"
+      aria-label="Attach file"
+      icon="plus"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="end"
+      aria-label="Add image"
+      icon="image"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="end"
+      aria-label="Record voice input"
+      icon="microphone"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-input>
+</ix-chat>
diff --git a/packages/angular-test-app/src/preview-examples/chat-input.ts b/packages/angular-test-app/src/preview-examples/chat-input.ts
new file mode 100644
index 00000000000..54f39055f73
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-input.ts
@@ -0,0 +1,33 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconImage,
+  iconMicrophone,
+  iconPdfDocument,
+  iconPlus,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  standalone: false,
+  selector: 'app-example',
+  templateUrl: './chat-input.html',
+})
+export default class ChatInput {
+  constructor() {
+    addIcons({
+      iconImage,
+      iconMicrophone,
+      iconPdfDocument,
+      iconPlus,
+    });
+  }
+}
diff --git a/packages/angular-test-app/src/preview-examples/chat-user-message.html b/packages/angular-test-app/src/preview-examples/chat-user-message.html
new file mode 100644
index 00000000000..1532c2470ff
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-user-message.html
@@ -0,0 +1,46 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-user-message message="Summarize the attached shift report.">
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="shift_report.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="operator_notes.txt"
+      icon="txt-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy message"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Edit message"
+      icon="pen"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Show more actions"
+      icon="more-menu"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-user-message>
+</ix-chat>
diff --git a/packages/angular-test-app/src/preview-examples/chat-user-message.ts b/packages/angular-test-app/src/preview-examples/chat-user-message.ts
new file mode 100644
index 00000000000..8aa46f061a9
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat-user-message.ts
@@ -0,0 +1,35 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  standalone: false,
+  selector: 'app-example',
+  templateUrl: './chat-user-message.html',
+})
+export default class ChatUserMessage {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconMoreMenu,
+      iconPdfDocument,
+      iconPen,
+      iconTxtDocument,
+    });
+  }
+}
diff --git a/packages/angular-test-app/src/preview-examples/chat.html b/packages/angular-test-app/src/preview-examples/chat.html
new file mode 100644
index 00000000000..3b411a67615
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat.html
@@ -0,0 +1,117 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<ix-chat class="chat-example__chat">
+  <ix-chat-user-message
+    message="Summarize the asset status and include the attached maintenance files."
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="equipment_status.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="maintenance_notes.txt"
+      icon="txt-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy message"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Edit message"
+      icon="pen"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Show more actions"
+      icon="more-menu"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  </ix-chat-user-message>
+
+  <ix-chat-ai-message>
+    <h3>Asset performance summary</h3>
+    <p>
+      The compressor train is operating inside the expected range. Vibration
+      increased slightly after the last shift change, but all values remain
+      below the warning threshold.
+    </p>
+    <ul class="message-list">
+      <li>Temperature trend is stable over the last 24 hours.</li>
+      <li>Two alarms were acknowledged by the operator.</li>
+      <li>Next service window is scheduled for Friday.</li>
+    </ul>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Copy response"
+      icon="copy"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Helpful response"
+      icon="thumb-up"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Not helpful response"
+      icon="thumb-down"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-icon-button
+      slot="actions"
+      aria-label="Regenerate response"
+      icon="refresh"
+      size="24"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+    <ix-chip slot="sources" icon="globe" outline variant="neutral">
+      Sources
+    </ix-chip>
+  </ix-chat-ai-message>
+
+  <ix-chat-user-message
+    message="Compare the current report with additional customer feedback."
+  >
+    <ix-chat-prompt-attachment
+      slot="attachments"
+      file-name="customer_feedback.pdf"
+      icon="pdf-document"
+      hide-remove-button
+    ></ix-chat-prompt-attachment>
+  </ix-chat-user-message>
+
+  <ix-chat-ai-message>
+    <p>
+      Customer feedback confirms the same maintenance priorities. The next step
+      is to validate spare-part availability and confirm the planned downtime
+      window.
+    </p>
+  </ix-chat-ai-message>
+
+  <ix-chat-input
+    slot="prompt"
+    value="Create a concise follow-up plan for the service team."
+  ></ix-chat-input>
+</ix-chat>
diff --git a/packages/angular-test-app/src/preview-examples/chat.ts b/packages/angular-test-app/src/preview-examples/chat.ts
new file mode 100644
index 00000000000..7ced38e1525
--- /dev/null
+++ b/packages/angular-test-app/src/preview-examples/chat.ts
@@ -0,0 +1,43 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component } from '@angular/core';
+import { addIcons } from '@siemens/ix-icons';
+import {
+  iconCopy,
+  iconGlobe,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+@Component({
+  standalone: false,
+  selector: 'app-example',
+  templateUrl: './chat.html',
+})
+export default class Chat {
+  constructor() {
+    addIcons({
+      iconCopy,
+      iconGlobe,
+      iconMoreMenu,
+      iconPdfDocument,
+      iconPen,
+      iconRefresh,
+      iconThumbDown,
+      iconThumbUp,
+      iconTxtDocument,
+    });
+  }
+}
diff --git a/packages/angular/src/components.ts b/packages/angular/src/components.ts
index e78248a9ba0..7909f1f0309 100644
--- a/packages/angular/src/components.ts
+++ b/packages/angular/src/components.ts
@@ -402,6 +402,154 @@ export declare interface IxCategoryFilter extends Components.IxCategoryFilter {
 }
 
 
+@ProxyCmp({
+})
+@Component({
+  selector: 'ix-chat',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: [],
+  standalone: false
+})
+export class IxChat {
+  protected el: HTMLIxChatElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChat extends Components.IxChat {}
+
+
+@ProxyCmp({
+})
+@Component({
+  selector: 'ix-chat-ai-message',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: [],
+  standalone: false
+})
+export class IxChatAiMessage {
+  protected el: HTMLIxChatAiMessageElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatAiMessage extends Components.IxChatAiMessage {}
+
+
+@ProxyCmp({
+  inputs: ['characterLimit', 'characterLimitWarningThreshold', 'disabled', 'disclaimer', 'i18nCharacterLimitReached', 'i18nCharacterLimitWarning', 'insertLineBreakOnEnter', 'maxLength', 'maxRows', 'minRows', 'name', 'placeholder', 'readonly', 'state', 'textareaLabel', 'value'],
+  methods: ['getNativeInputElement', 'focusInput']
+})
+@Component({
+  selector: 'ix-chat-input',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['characterLimit', 'characterLimitWarningThreshold', 'disabled', 'disclaimer', 'i18nCharacterLimitReached', 'i18nCharacterLimitWarning', 'insertLineBreakOnEnter', 'maxLength', 'maxRows', 'minRows', 'name', 'placeholder', 'readonly', 'state', 'textareaLabel', 'value'],
+  outputs: ['valueChange', 'ixBlur', 'ixChange', 'promptSubmit'],
+  standalone: false
+})
+export class IxChatInput {
+  protected el: HTMLIxChatInputElement;
+  @Output() valueChange = new EventEmitter<CustomEvent<string>>();
+  @Output() ixBlur = new EventEmitter<CustomEvent<void>>();
+  @Output() ixChange = new EventEmitter<CustomEvent<string>>();
+  @Output() promptSubmit = new EventEmitter<CustomEvent<string>>();
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatInput extends Components.IxChatInput {
+  /**
+   * Event emitted when the value of the chat input changes. @since 5.1.0
+   */
+  valueChange: EventEmitter<CustomEvent<string>>;
+  /**
+   * Event emitted when the chat input loses focus. @since 5.1.0
+   */
+  ixBlur: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the chat input loses focus and the value has changed. @since 5.1.0
+   */
+  ixChange: EventEmitter<CustomEvent<string>>;
+  /**
+   * Event emitted when the prompt is submitted by the send button or Enter key. @since 5.1.0
+   */
+  promptSubmit: EventEmitter<CustomEvent<string>>;
+}
+
+
+@ProxyCmp({
+  inputs: ['fileName', 'hideRemoveButton', 'icon', 'previewSupported', 'removeAriaLabel', 'status']
+})
+@Component({
+  selector: 'ix-chat-prompt-attachment',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['fileName', 'hideRemoveButton', 'icon', 'previewSupported', 'removeAriaLabel', 'status'],
+  outputs: ['attachmentClick', 'removeClick'],
+  standalone: false
+})
+export class IxChatPromptAttachment {
+  protected el: HTMLIxChatPromptAttachmentElement;
+  @Output() attachmentClick = new EventEmitter<CustomEvent<void>>();
+  @Output() removeClick = new EventEmitter<CustomEvent<void>>();
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatPromptAttachment extends Components.IxChatPromptAttachment {
+  /**
+   * Event emitted when the attachment is clicked. @since 5.1.0
+   */
+  attachmentClick: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the remove action is clicked. @since 5.1.0
+   */
+  removeClick: EventEmitter<CustomEvent<void>>;
+}
+
+
+@ProxyCmp({
+  inputs: ['message']
+})
+@Component({
+  selector: 'ix-chat-user-message',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['message'],
+  standalone: false
+})
+export class IxChatUserMessage {
+  protected el: HTMLIxChatUserMessageElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatUserMessage extends Components.IxChatUserMessage {}
+
+
 @ProxyCmp({
   inputs: ['checked', 'disabled', 'indeterminate', 'label', 'name', 'required', 'value']
 })
diff --git a/packages/angular/src/declare-components.ts b/packages/angular/src/declare-components.ts
index 289d29e903a..9427058fde4 100644
--- a/packages/angular/src/declare-components.ts
+++ b/packages/angular/src/declare-components.ts
@@ -16,6 +16,11 @@ export const DIRECTIVES = [
   d.IxCardList,
   d.IxCardTitle,
   d.IxCategoryFilter,
+  d.IxChat,
+  d.IxChatAiMessage,
+  d.IxChatInput,
+  d.IxChatPromptAttachment,
+  d.IxChatUserMessage,
   d.IxCheckbox,
   d.IxCheckboxGroup,
   d.IxChip,
diff --git a/packages/angular/standalone/src/components.ts b/packages/angular/standalone/src/components.ts
index 71ded1eea1c..2f64ab8d056 100644
--- a/packages/angular/standalone/src/components.ts
+++ b/packages/angular/standalone/src/components.ts
@@ -20,6 +20,11 @@ import { defineCustomElement as defineIxCardContent } from '@siemens/ix/componen
 import { defineCustomElement as defineIxCardList } from '@siemens/ix/components/ix-card-list.js';
 import { defineCustomElement as defineIxCardTitle } from '@siemens/ix/components/ix-card-title.js';
 import { defineCustomElement as defineIxCategoryFilter } from '@siemens/ix/components/ix-category-filter.js';
+import { defineCustomElement as defineIxChat } from '@siemens/ix/components/ix-chat.js';
+import { defineCustomElement as defineIxChatAiMessage } from '@siemens/ix/components/ix-chat-ai-message.js';
+import { defineCustomElement as defineIxChatInput } from '@siemens/ix/components/ix-chat-input.js';
+import { defineCustomElement as defineIxChatPromptAttachment } from '@siemens/ix/components/ix-chat-prompt-attachment.js';
+import { defineCustomElement as defineIxChatUserMessage } from '@siemens/ix/components/ix-chat-user-message.js';
 import { defineCustomElement as defineIxCheckbox } from '@siemens/ix/components/ix-checkbox.js';
 import { defineCustomElement as defineIxCheckboxGroup } from '@siemens/ix/components/ix-checkbox-group.js';
 import { defineCustomElement as defineIxChip } from '@siemens/ix/components/ix-chip.js';
@@ -501,6 +506,154 @@ export declare interface IxCategoryFilter extends Components.IxCategoryFilter {
 }
 
 
+@ProxyCmp({
+  defineCustomElementFn: defineIxChat
+})
+@Component({
+  selector: 'ix-chat',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: [],
+})
+export class IxChat {
+  protected el: HTMLIxChatElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChat extends Components.IxChat {}
+
+
+@ProxyCmp({
+  defineCustomElementFn: defineIxChatAiMessage
+})
+@Component({
+  selector: 'ix-chat-ai-message',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: [],
+})
+export class IxChatAiMessage {
+  protected el: HTMLIxChatAiMessageElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatAiMessage extends Components.IxChatAiMessage {}
+
+
+@ProxyCmp({
+  defineCustomElementFn: defineIxChatInput,
+  inputs: ['characterLimit', 'characterLimitWarningThreshold', 'disabled', 'disclaimer', 'i18nCharacterLimitReached', 'i18nCharacterLimitWarning', 'insertLineBreakOnEnter', 'maxLength', 'maxRows', 'minRows', 'name', 'placeholder', 'readonly', 'state', 'textareaLabel', 'value'],
+  methods: ['getNativeInputElement', 'focusInput']
+})
+@Component({
+  selector: 'ix-chat-input',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['characterLimit', 'characterLimitWarningThreshold', 'disabled', 'disclaimer', 'i18nCharacterLimitReached', 'i18nCharacterLimitWarning', 'insertLineBreakOnEnter', 'maxLength', 'maxRows', 'minRows', 'name', 'placeholder', 'readonly', 'state', 'textareaLabel', 'value'],
+  outputs: ['valueChange', 'ixBlur', 'ixChange', 'promptSubmit'],
+})
+export class IxChatInput {
+  protected el: HTMLIxChatInputElement;
+  @Output() valueChange = new EventEmitter<CustomEvent<string>>();
+  @Output() ixBlur = new EventEmitter<CustomEvent<void>>();
+  @Output() ixChange = new EventEmitter<CustomEvent<string>>();
+  @Output() promptSubmit = new EventEmitter<CustomEvent<string>>();
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatInput extends Components.IxChatInput {
+  /**
+   * Event emitted when the value of the chat input changes. @since 5.1.0
+   */
+  valueChange: EventEmitter<CustomEvent<string>>;
+  /**
+   * Event emitted when the chat input loses focus. @since 5.1.0
+   */
+  ixBlur: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the chat input loses focus and the value has changed. @since 5.1.0
+   */
+  ixChange: EventEmitter<CustomEvent<string>>;
+  /**
+   * Event emitted when the prompt is submitted by the send button or Enter key. @since 5.1.0
+   */
+  promptSubmit: EventEmitter<CustomEvent<string>>;
+}
+
+
+@ProxyCmp({
+  defineCustomElementFn: defineIxChatPromptAttachment,
+  inputs: ['fileName', 'hideRemoveButton', 'icon', 'previewSupported', 'removeAriaLabel', 'status']
+})
+@Component({
+  selector: 'ix-chat-prompt-attachment',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['fileName', 'hideRemoveButton', 'icon', 'previewSupported', 'removeAriaLabel', 'status'],
+  outputs: ['attachmentClick', 'removeClick'],
+})
+export class IxChatPromptAttachment {
+  protected el: HTMLIxChatPromptAttachmentElement;
+  @Output() attachmentClick = new EventEmitter<CustomEvent<void>>();
+  @Output() removeClick = new EventEmitter<CustomEvent<void>>();
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatPromptAttachment extends Components.IxChatPromptAttachment {
+  /**
+   * Event emitted when the attachment is clicked. @since 5.1.0
+   */
+  attachmentClick: EventEmitter<CustomEvent<void>>;
+  /**
+   * Event emitted when the remove action is clicked. @since 5.1.0
+   */
+  removeClick: EventEmitter<CustomEvent<void>>;
+}
+
+
+@ProxyCmp({
+  defineCustomElementFn: defineIxChatUserMessage,
+  inputs: ['message']
+})
+@Component({
+  selector: 'ix-chat-user-message',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  template: '<ng-content></ng-content>',
+  // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+  inputs: ['message'],
+})
+export class IxChatUserMessage {
+  protected el: HTMLIxChatUserMessageElement;
+  constructor(c: ChangeDetectorRef, r: ElementRef, protected z: NgZone) {
+    c.detach();
+    this.el = r.nativeElement;
+  }
+}
+
+
+export declare interface IxChatUserMessage extends Components.IxChatUserMessage {}
+
+
 @ProxyCmp({
   defineCustomElementFn: defineIxCheckbox,
   inputs: ['checked', 'disabled', 'indeterminate', 'label', 'name', 'required', 'value']
diff --git a/packages/core/scss/mixins/_scrollbar.scss b/packages/core/scss/mixins/_scrollbar.scss
index 3467193c259..aa48545913e 100644
--- a/packages/core/scss/mixins/_scrollbar.scss
+++ b/packages/core/scss/mixins/_scrollbar.scss
@@ -6,13 +6,13 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-@mixin scrollbar() {
-  ::-webkit-scrollbar-button {
+@mixin _scrollbar-rules {
+  &::-webkit-scrollbar-button {
     display: none;
   }
 
   @-moz-document url-prefix() {
-    * {
+    & {
       scrollbar-color: var(--theme-scrollbar-thumb--background)
         var(--theme-scrollbar-track--background);
       scrollbar-width: thin;
@@ -20,33 +20,45 @@
   }
 
   /* width */
-  ::-webkit-scrollbar {
+  &::-webkit-scrollbar {
     width: 0.5rem;
     height: 0.5rem;
   }
 
   /* Track */
-  ::-webkit-scrollbar-track {
+  &::-webkit-scrollbar-track {
     border-radius: 5px;
     background: var(--theme-scrollbar-track--background);
   }
 
-  ::-webkit-scrollbar-track:hover {
+  &::-webkit-scrollbar-track:hover {
     background: var(--theme-scrollbar-track--background--hover);
   }
 
   /* Handle */
-  ::-webkit-scrollbar-thumb {
+  &::-webkit-scrollbar-thumb {
     border-radius: 5px;
     background: var(--theme-scrollbar-thumb--background);
   }
 
   /* Handle on hover */
-  ::-webkit-scrollbar-thumb:hover {
+  &::-webkit-scrollbar-thumb:hover {
     background: var(--theme-scrollbar-thumb--background--hover);
   }
 
-  ::-webkit-scrollbar-corner {
+  &::-webkit-scrollbar-corner {
     display: none;
   }
 }
+
+@mixin scrollbar($include-current: false) {
+  * {
+    @include _scrollbar-rules;
+  }
+
+  @if $include-current {
+    & {
+      @include _scrollbar-rules;
+    }
+  }
+}
diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index b8e6da5b3b5..8078ab6fe43 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -18,6 +18,7 @@ import { CardAccordionExpandChangeEvent, CardAccordionVariant } from "./componen
 import { FilterState } from "./components/category-filter/filter-state";
 import { LogicalFilterOperator } from "./components/category-filter/logical-filter-operator";
 import { InputState } from "./components/category-filter/input-state";
+import { ChatPromptAttachmentStatus } from "./components/chat-prompt-attachment/chat-prompt-attachment.types";
 import { ChipVariant } from "./components/chip/chip.types";
 import { ColumnSize } from "./components/col/col.types";
 import { ContentHeaderVariant } from "./components/content-header/content-header.types";
@@ -73,6 +74,7 @@ export { CardAccordionExpandChangeEvent, CardAccordionVariant } from "./componen
 export { FilterState } from "./components/category-filter/filter-state";
 export { LogicalFilterOperator } from "./components/category-filter/logical-filter-operator";
 export { InputState } from "./components/category-filter/input-state";
+export { ChatPromptAttachmentStatus } from "./components/chat-prompt-attachment/chat-prompt-attachment.types";
 export { ChipVariant } from "./components/chip/chip.types";
 export { ColumnSize } from "./components/col/col.types";
 export { ContentHeaderVariant } from "./components/content-header/content-header.types";
@@ -624,6 +626,177 @@ export namespace Components {
          */
         "uniqueCategories": boolean;
     }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChat {
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatAiMessage {
+    }
+    /**
+     * @since 5.1.0
+     * @form-ready 
+     */
+    interface IxChatInput {
+        /**
+          * Character limit used for the optional inline character limit message. Falls back to `maxLength` when not set.
+          * @since 5.1.0
+         */
+        "characterLimit"?: number;
+        /**
+          * Percentage of the character limit that triggers the soft warning. Define a number between 0 and 1 (e.g. 0.8 for 80%).
+          * @since 5.1.0
+          * @default 0.9
+         */
+        "characterLimitWarningThreshold": number;
+        /**
+          * Specifies whether the chat input is disabled.
+          * @since 5.1.0
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * Disclaimer text displayed below the chat input.
+          * @since 5.1.0
+          * @default 'This content is AI-generated. Always verify the information for accuracy.'
+         */
+        "disclaimer": string;
+        /**
+          * Focuses the chat input.
+          * @since 5.1.0
+         */
+        "focusInput": () => Promise<void>;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        /**
+          * Returns the native textarea element used by the chat input.
+          * @since 5.1.0
+         */
+        "getNativeInputElement": () => Promise<HTMLTextAreaElement>;
+        /**
+          * i18n label for the hard character limit message. Use `{current}` and `{limit}` placeholders to place the values in any order.
+          * @since 5.1.0
+          * @default 'Character limit reached ({current} / {limit} characters)'
+         */
+        "i18nCharacterLimitReached": string;
+        /**
+          * i18n label for the soft character limit warning. Use `{current}` and `{limit}` placeholders to place the values in any order.
+          * @since 5.1.0
+          * @default "You're nearing the limit ({current} / {limit} characters)"
+         */
+        "i18nCharacterLimitWarning": string;
+        /**
+          * If true, pressing Enter inserts a line break instead of submitting the prompt.
+          * @since 5.1.0
+          * @default false
+         */
+        "insertLineBreakOnEnter": boolean;
+        /**
+          * The maximum length of the chat input.
+          * @since 5.1.0
+         */
+        "maxLength"?: number;
+        /**
+          * Maximum number of visible text rows before the input becomes scrollable.
+          * @since 5.1.0
+          * @default 6
+         */
+        "maxRows": number;
+        /**
+          * Minimum number of visible text rows.
+          * @since 5.1.0
+          * @default 1
+         */
+        "minRows": number;
+        /**
+          * The name of the chat input.
+          * @since 5.1.0
+         */
+        "name"?: string;
+        /**
+          * The placeholder text for the chat input.
+          * @since 5.1.0
+          * @default 'Enter a command, question or topic...'
+         */
+        "placeholder": string;
+        /**
+          * Specifies whether the chat input is readonly.
+          * @since 5.1.0
+          * @default false
+         */
+        "readonly": boolean;
+        /**
+          * The state of the chat input, which can be either 'input' or 'processing'.
+          * @since 5.1.0
+          * @default 'input'
+         */
+        "state"?: 'input' | 'processing';
+        /**
+          * Accessible label for the native textarea.
+          * @since 5.1.0
+          * @default 'Chat input'
+         */
+        "textareaLabel": string;
+        /**
+          * The value of the chat input.
+          * @since 5.1.0
+          * @default ''
+         */
+        "value": string;
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatPromptAttachment {
+        /**
+          * Name of the attached file.
+          * @since 5.1.0
+          * @default ''
+         */
+        "fileName": string;
+        /**
+          * Hide the remove action.
+          * @since 5.1.0
+          * @default false
+         */
+        "hideRemoveButton": boolean;
+        /**
+          * Icon displayed before the file name.
+          * @since 5.1.0
+          * @default iconTxtDocument
+         */
+        "icon": string;
+        /**
+          * Enable preview interaction for default attachments.
+          * @since 5.1.0
+          * @default false
+         */
+        "previewSupported": boolean;
+        /**
+          * Accessible label for the remove action.
+          * @since 5.1.0
+          * @default 'Remove attachment'
+         */
+        "removeAriaLabel": string;
+        /**
+          * Upload status of the attachment.
+          * @since 5.1.0
+          * @default 'default'
+         */
+        "status": ChatPromptAttachmentStatus;
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatUserMessage {
+        /**
+          * Text displayed in the user message bubble.
+          * @since 5.1.0
+         */
+        "message"?: string;
+    }
     /**
      * @form-ready 
      */
@@ -745,7 +918,7 @@ export namespace Components {
          */
         "icon"?: string;
         /**
-          * Determines if the chip is interactive. If true no user input (e.g. mouse states, keyboard navigation) will be possible and also the close button will not be present.
+          * Determines if the chip is interactive. If true no user input (e.g. mouse states, keyboard navigation) will be possible on the main chip content.
           * @default false
          */
         "inactive": boolean;
@@ -4595,6 +4768,14 @@ export interface IxCategoryFilterCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxCategoryFilterElement;
 }
+export interface IxChatInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxChatInputElement;
+}
+export interface IxChatPromptAttachmentCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxChatPromptAttachmentElement;
+}
 export interface IxCheckboxCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxCheckboxElement;
@@ -4993,6 +5174,78 @@ declare global {
         prototype: HTMLIxCategoryFilterElement;
         new (): HTMLIxCategoryFilterElement;
     };
+    /**
+     * @since 5.1.0
+     */
+    interface HTMLIxChatElement extends Components.IxChat, HTMLStencilElement {
+    }
+    var HTMLIxChatElement: {
+        prototype: HTMLIxChatElement;
+        new (): HTMLIxChatElement;
+    };
+    /**
+     * @since 5.1.0
+     */
+    interface HTMLIxChatAiMessageElement extends Components.IxChatAiMessage, HTMLStencilElement {
+    }
+    var HTMLIxChatAiMessageElement: {
+        prototype: HTMLIxChatAiMessageElement;
+        new (): HTMLIxChatAiMessageElement;
+    };
+    interface HTMLIxChatInputElementEventMap {
+        "valueChange": string;
+        "ixBlur": void;
+        "ixChange": string;
+        "promptSubmit": string;
+    }
+    /**
+     * @since 5.1.0
+     * @form-ready 
+     */
+    interface HTMLIxChatInputElement extends Components.IxChatInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxChatInputElementEventMap>(type: K, listener: (this: HTMLIxChatInputElement, ev: IxChatInputCustomEvent<HTMLIxChatInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxChatInputElementEventMap>(type: K, listener: (this: HTMLIxChatInputElement, ev: IxChatInputCustomEvent<HTMLIxChatInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxChatInputElement: {
+        prototype: HTMLIxChatInputElement;
+        new (): HTMLIxChatInputElement;
+    };
+    interface HTMLIxChatPromptAttachmentElementEventMap {
+        "attachmentClick": void;
+        "removeClick": void;
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface HTMLIxChatPromptAttachmentElement extends Components.IxChatPromptAttachment, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxChatPromptAttachmentElementEventMap>(type: K, listener: (this: HTMLIxChatPromptAttachmentElement, ev: IxChatPromptAttachmentCustomEvent<HTMLIxChatPromptAttachmentElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxChatPromptAttachmentElementEventMap>(type: K, listener: (this: HTMLIxChatPromptAttachmentElement, ev: IxChatPromptAttachmentCustomEvent<HTMLIxChatPromptAttachmentElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxChatPromptAttachmentElement: {
+        prototype: HTMLIxChatPromptAttachmentElement;
+        new (): HTMLIxChatPromptAttachmentElement;
+    };
+    /**
+     * @since 5.1.0
+     */
+    interface HTMLIxChatUserMessageElement extends Components.IxChatUserMessage, HTMLStencilElement {
+    }
+    var HTMLIxChatUserMessageElement: {
+        prototype: HTMLIxChatUserMessageElement;
+        new (): HTMLIxChatUserMessageElement;
+    };
     interface HTMLIxCheckboxElementEventMap {
         "checkedChange": boolean;
         "valueChange": string;
@@ -6292,6 +6545,11 @@ declare global {
         "ix-card-list": HTMLIxCardListElement;
         "ix-card-title": HTMLIxCardTitleElement;
         "ix-category-filter": HTMLIxCategoryFilterElement;
+        "ix-chat": HTMLIxChatElement;
+        "ix-chat-ai-message": HTMLIxChatAiMessageElement;
+        "ix-chat-input": HTMLIxChatInputElement;
+        "ix-chat-prompt-attachment": HTMLIxChatPromptAttachmentElement;
+        "ix-chat-user-message": HTMLIxChatUserMessageElement;
         "ix-checkbox": HTMLIxCheckboxElement;
         "ix-checkbox-group": HTMLIxCheckboxGroupElement;
         "ix-chip": HTMLIxChipElement;
@@ -6960,6 +7218,200 @@ declare namespace LocalJSX {
          */
         "uniqueCategories"?: boolean;
     }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChat {
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatAiMessage {
+    }
+    /**
+     * @since 5.1.0
+     * @form-ready 
+     */
+    interface IxChatInput {
+        /**
+          * Character limit used for the optional inline character limit message. Falls back to `maxLength` when not set.
+          * @since 5.1.0
+         */
+        "characterLimit"?: number;
+        /**
+          * Percentage of the character limit that triggers the soft warning. Define a number between 0 and 1 (e.g. 0.8 for 80%).
+          * @since 5.1.0
+          * @default 0.9
+         */
+        "characterLimitWarningThreshold"?: number;
+        /**
+          * Specifies whether the chat input is disabled.
+          * @since 5.1.0
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * Disclaimer text displayed below the chat input.
+          * @since 5.1.0
+          * @default 'This content is AI-generated. Always verify the information for accuracy.'
+         */
+        "disclaimer"?: string;
+        /**
+          * The `id` of a `<form>` element to associate this element with.
+         */
+        "form"?: string;
+        /**
+          * i18n label for the hard character limit message. Use `{current}` and `{limit}` placeholders to place the values in any order.
+          * @since 5.1.0
+          * @default 'Character limit reached ({current} / {limit} characters)'
+         */
+        "i18nCharacterLimitReached"?: string;
+        /**
+          * i18n label for the soft character limit warning. Use `{current}` and `{limit}` placeholders to place the values in any order.
+          * @since 5.1.0
+          * @default "You're nearing the limit ({current} / {limit} characters)"
+         */
+        "i18nCharacterLimitWarning"?: string;
+        /**
+          * If true, pressing Enter inserts a line break instead of submitting the prompt.
+          * @since 5.1.0
+          * @default false
+         */
+        "insertLineBreakOnEnter"?: boolean;
+        /**
+          * The maximum length of the chat input.
+          * @since 5.1.0
+         */
+        "maxLength"?: number;
+        /**
+          * Maximum number of visible text rows before the input becomes scrollable.
+          * @since 5.1.0
+          * @default 6
+         */
+        "maxRows"?: number;
+        /**
+          * Minimum number of visible text rows.
+          * @since 5.1.0
+          * @default 1
+         */
+        "minRows"?: number;
+        /**
+          * The name of the chat input.
+          * @since 5.1.0
+         */
+        "name"?: string;
+        /**
+          * Event emitted when the chat input loses focus.
+          * @since 5.1.0
+         */
+        "onIxBlur"?: (event: IxChatInputCustomEvent<void>) => void;
+        /**
+          * Event emitted when the chat input loses focus and the value has changed.
+          * @since 5.1.0
+         */
+        "onIxChange"?: (event: IxChatInputCustomEvent<string>) => void;
+        /**
+          * Event emitted when the prompt is submitted by the send button or Enter key.
+          * @since 5.1.0
+         */
+        "onPromptSubmit"?: (event: IxChatInputCustomEvent<string>) => void;
+        /**
+          * Event emitted when the value of the chat input changes.
+          * @since 5.1.0
+         */
+        "onValueChange"?: (event: IxChatInputCustomEvent<string>) => void;
+        /**
+          * The placeholder text for the chat input.
+          * @since 5.1.0
+          * @default 'Enter a command, question or topic...'
+         */
+        "placeholder"?: string;
+        /**
+          * Specifies whether the chat input is readonly.
+          * @since 5.1.0
+          * @default false
+         */
+        "readonly"?: boolean;
+        /**
+          * The state of the chat input, which can be either 'input' or 'processing'.
+          * @since 5.1.0
+          * @default 'input'
+         */
+        "state"?: 'input' | 'processing';
+        /**
+          * Accessible label for the native textarea.
+          * @since 5.1.0
+          * @default 'Chat input'
+         */
+        "textareaLabel"?: string;
+        /**
+          * The value of the chat input.
+          * @since 5.1.0
+          * @default ''
+         */
+        "value"?: string;
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatPromptAttachment {
+        /**
+          * Name of the attached file.
+          * @since 5.1.0
+          * @default ''
+         */
+        "fileName"?: string;
+        /**
+          * Hide the remove action.
+          * @since 5.1.0
+          * @default false
+         */
+        "hideRemoveButton"?: boolean;
+        /**
+          * Icon displayed before the file name.
+          * @since 5.1.0
+          * @default iconTxtDocument
+         */
+        "icon"?: string;
+        /**
+          * Event emitted when the attachment is clicked.
+          * @since 5.1.0
+         */
+        "onAttachmentClick"?: (event: IxChatPromptAttachmentCustomEvent<void>) => void;
+        /**
+          * Event emitted when the remove action is clicked.
+          * @since 5.1.0
+         */
+        "onRemoveClick"?: (event: IxChatPromptAttachmentCustomEvent<void>) => void;
+        /**
+          * Enable preview interaction for default attachments.
+          * @since 5.1.0
+          * @default false
+         */
+        "previewSupported"?: boolean;
+        /**
+          * Accessible label for the remove action.
+          * @since 5.1.0
+          * @default 'Remove attachment'
+         */
+        "removeAriaLabel"?: string;
+        /**
+          * Upload status of the attachment.
+          * @since 5.1.0
+          * @default 'default'
+         */
+        "status"?: ChatPromptAttachmentStatus;
+    }
+    /**
+     * @since 5.1.0
+     */
+    interface IxChatUserMessage {
+        /**
+          * Text displayed in the user message bubble.
+          * @since 5.1.0
+         */
+        "message"?: string;
+    }
     /**
      * @form-ready 
      */
@@ -7092,7 +7544,7 @@ declare namespace LocalJSX {
          */
         "icon"?: string;
         /**
-          * Determines if the chip is interactive. If true no user input (e.g. mouse states, keyboard navigation) will be possible and also the close button will not be present.
+          * Determines if the chip is interactive. If true no user input (e.g. mouse states, keyboard navigation) will be possible on the main chip content.
           * @default false
          */
         "inactive"?: boolean;
@@ -11275,6 +11727,35 @@ declare namespace LocalJSX {
         "ariaLabelFilterInput": string;
         "enableTopLayer": boolean;
     }
+    interface IxChatInputAttributes {
+        "state": 'input' | 'processing';
+        "name": string;
+        "placeholder": string;
+        "value": string;
+        "disabled": boolean;
+        "readonly": boolean;
+        "textareaLabel": string;
+        "maxLength": number;
+        "characterLimit": number;
+        "i18nCharacterLimitReached": string;
+        "i18nCharacterLimitWarning": string;
+        "characterLimitWarningThreshold": number;
+        "minRows": number;
+        "maxRows": number;
+        "insertLineBreakOnEnter": boolean;
+        "disclaimer": string;
+    }
+    interface IxChatPromptAttachmentAttributes {
+        "fileName": string;
+        "status": ChatPromptAttachmentStatus;
+        "icon": string;
+        "hideRemoveButton": boolean;
+        "previewSupported": boolean;
+        "removeAriaLabel": string;
+    }
+    interface IxChatUserMessageAttributes {
+        "message": string;
+    }
     interface IxCheckboxAttributes {
         "name": string;
         "value": string;
@@ -12195,6 +12676,11 @@ declare namespace LocalJSX {
         "ix-card-list": Omit<IxCardList, keyof IxCardListAttributes> & { [K in keyof IxCardList & keyof IxCardListAttributes]?: IxCardList[K] } & { [K in keyof IxCardList & keyof IxCardListAttributes as `attr:${K}`]?: IxCardListAttributes[K] } & { [K in keyof IxCardList & keyof IxCardListAttributes as `prop:${K}`]?: IxCardList[K] };
         "ix-card-title": IxCardTitle;
         "ix-category-filter": Omit<IxCategoryFilter, keyof IxCategoryFilterAttributes> & { [K in keyof IxCategoryFilter & keyof IxCategoryFilterAttributes]?: IxCategoryFilter[K] } & { [K in keyof IxCategoryFilter & keyof IxCategoryFilterAttributes as `attr:${K}`]?: IxCategoryFilterAttributes[K] } & { [K in keyof IxCategoryFilter & keyof IxCategoryFilterAttributes as `prop:${K}`]?: IxCategoryFilter[K] };
+        "ix-chat": IxChat;
+        "ix-chat-ai-message": IxChatAiMessage;
+        "ix-chat-input": Omit<IxChatInput, keyof IxChatInputAttributes> & { [K in keyof IxChatInput & keyof IxChatInputAttributes]?: IxChatInput[K] } & { [K in keyof IxChatInput & keyof IxChatInputAttributes as `attr:${K}`]?: IxChatInputAttributes[K] } & { [K in keyof IxChatInput & keyof IxChatInputAttributes as `prop:${K}`]?: IxChatInput[K] };
+        "ix-chat-prompt-attachment": Omit<IxChatPromptAttachment, keyof IxChatPromptAttachmentAttributes> & { [K in keyof IxChatPromptAttachment & keyof IxChatPromptAttachmentAttributes]?: IxChatPromptAttachment[K] } & { [K in keyof IxChatPromptAttachment & keyof IxChatPromptAttachmentAttributes as `attr:${K}`]?: IxChatPromptAttachmentAttributes[K] } & { [K in keyof IxChatPromptAttachment & keyof IxChatPromptAttachmentAttributes as `prop:${K}`]?: IxChatPromptAttachment[K] };
+        "ix-chat-user-message": Omit<IxChatUserMessage, keyof IxChatUserMessageAttributes> & { [K in keyof IxChatUserMessage & keyof IxChatUserMessageAttributes]?: IxChatUserMessage[K] } & { [K in keyof IxChatUserMessage & keyof IxChatUserMessageAttributes as `attr:${K}`]?: IxChatUserMessageAttributes[K] } & { [K in keyof IxChatUserMessage & keyof IxChatUserMessageAttributes as `prop:${K}`]?: IxChatUserMessage[K] };
         "ix-checkbox": Omit<IxCheckbox, keyof IxCheckboxAttributes> & { [K in keyof IxCheckbox & keyof IxCheckboxAttributes]?: IxCheckbox[K] } & { [K in keyof IxCheckbox & keyof IxCheckboxAttributes as `attr:${K}`]?: IxCheckboxAttributes[K] } & { [K in keyof IxCheckbox & keyof IxCheckboxAttributes as `prop:${K}`]?: IxCheckbox[K] };
         "ix-checkbox-group": Omit<IxCheckboxGroup, keyof IxCheckboxGroupAttributes> & { [K in keyof IxCheckboxGroup & keyof IxCheckboxGroupAttributes]?: IxCheckboxGroup[K] } & { [K in keyof IxCheckboxGroup & keyof IxCheckboxGroupAttributes as `attr:${K}`]?: IxCheckboxGroupAttributes[K] } & { [K in keyof IxCheckboxGroup & keyof IxCheckboxGroupAttributes as `prop:${K}`]?: IxCheckboxGroup[K] };
         "ix-chip": Omit<IxChip, keyof IxChipAttributes> & { [K in keyof IxChip & keyof IxChipAttributes]?: IxChip[K] } & { [K in keyof IxChip & keyof IxChipAttributes as `attr:${K}`]?: IxChipAttributes[K] } & { [K in keyof IxChip & keyof IxChipAttributes as `prop:${K}`]?: IxChip[K] };
@@ -12311,6 +12797,27 @@ declare module "@stencil/core" {
             "ix-card-list": LocalJSX.IntrinsicElements["ix-card-list"] & JSXBase.HTMLAttributes<HTMLIxCardListElement>;
             "ix-card-title": LocalJSX.IntrinsicElements["ix-card-title"] & JSXBase.HTMLAttributes<HTMLIxCardTitleElement>;
             "ix-category-filter": LocalJSX.IntrinsicElements["ix-category-filter"] & JSXBase.HTMLAttributes<HTMLIxCategoryFilterElement>;
+            /**
+             * @since 5.1.0
+             */
+            "ix-chat": LocalJSX.IntrinsicElements["ix-chat"] & JSXBase.HTMLAttributes<HTMLIxChatElement>;
+            /**
+             * @since 5.1.0
+             */
+            "ix-chat-ai-message": LocalJSX.IntrinsicElements["ix-chat-ai-message"] & JSXBase.HTMLAttributes<HTMLIxChatAiMessageElement>;
+            /**
+             * @since 5.1.0
+             * @form-ready 
+             */
+            "ix-chat-input": LocalJSX.IntrinsicElements["ix-chat-input"] & JSXBase.HTMLAttributes<HTMLIxChatInputElement>;
+            /**
+             * @since 5.1.0
+             */
+            "ix-chat-prompt-attachment": LocalJSX.IntrinsicElements["ix-chat-prompt-attachment"] & JSXBase.HTMLAttributes<HTMLIxChatPromptAttachmentElement>;
+            /**
+             * @since 5.1.0
+             */
+            "ix-chat-user-message": LocalJSX.IntrinsicElements["ix-chat-user-message"] & JSXBase.HTMLAttributes<HTMLIxChatUserMessageElement>;
             /**
              * @form-ready 
              */
diff --git a/packages/core/src/components/chat-ai-message/chat-ai-message.scss b/packages/core/src/components/chat-ai-message/chat-ai-message.scss
new file mode 100644
index 00000000000..c6c3f2a7913
--- /dev/null
+++ b/packages/core/src/components/chat-ai-message/chat-ai-message.scss
@@ -0,0 +1,94 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@use 'mixins/shadow-dom/component';
+
+:host {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 100%;
+  min-width: 0;
+  gap: var(--theme-space-3);
+  box-sizing: border-box;
+  color: var(--theme-color-std-text);
+
+  @include component.ix-component;
+
+  .message {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    width: 100%;
+    min-width: 0;
+    gap: var(--theme-space-3);
+    font-size: var(--theme-font-size-l);
+    line-height: 1.5;
+    overflow-wrap: anywhere;
+  }
+
+  .message ::slotted(*) {
+    margin: 0;
+    color: inherit;
+    overflow-wrap: anywhere;
+  }
+
+  .message ::slotted(h1),
+  .message ::slotted(h2),
+  .message ::slotted(h3),
+  .message ::slotted(h4),
+  .message ::slotted(h5),
+  .message ::slotted(h6) {
+    font-size: var(--theme-font-size-l);
+    font-weight: var(--theme-font-weight-bold);
+    line-height: 1.2;
+  }
+
+  .meta {
+    display: none;
+    align-items: center;
+    gap: var(--theme-space-3);
+    width: 100%;
+    min-height: 2rem;
+  }
+
+  .actions {
+    display: none;
+    align-items: center;
+    gap: 0.25rem;
+  }
+
+  .sources {
+    display: none;
+    align-items: center;
+  }
+
+  .actions ::slotted(ix-icon-button),
+  .sources ::slotted(*) {
+    flex: 0 0 auto;
+  }
+}
+
+:host(.has-meta) {
+  .meta {
+    display: flex;
+  }
+}
+
+:host(.has-actions) {
+  .actions {
+    display: flex;
+  }
+}
+
+:host(.has-sources) {
+  .sources {
+    display: flex;
+  }
+}
diff --git a/packages/core/src/components/chat-ai-message/chat-ai-message.tsx b/packages/core/src/components/chat-ai-message/chat-ai-message.tsx
new file mode 100644
index 00000000000..9a0c6c5df15
--- /dev/null
+++ b/packages/core/src/components/chat-ai-message/chat-ai-message.tsx
@@ -0,0 +1,72 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component, Host, State, h } from '@stencil/core';
+
+/**
+ * @since 5.1.0
+ * @slot - AI-generated message content
+ * @slot actions - Optional actions displayed below the AI message
+ * @slot sources - Optional sources displayed next to the AI message actions
+ */
+@Component({
+  tag: 'ix-chat-ai-message',
+  styleUrl: 'chat-ai-message.scss',
+  shadow: true,
+})
+export class ChatAiMessage {
+  @State() hasActions = false;
+  @State() hasSources = false;
+
+  private hasAssignedContent(slot: HTMLSlotElement) {
+    return slot.assignedNodes({ flatten: true }).some((node) => {
+      return node.nodeType === 1 || !!node.textContent?.trim();
+    });
+  }
+
+  private handleActionsSlotChange(event: Event) {
+    this.hasActions = this.hasAssignedContent(event.target as HTMLSlotElement);
+  }
+
+  private handleSourcesSlotChange(event: Event) {
+    this.hasSources = this.hasAssignedContent(event.target as HTMLSlotElement);
+  }
+
+  render() {
+    const hasMeta = this.hasActions || this.hasSources;
+
+    return (
+      <Host
+        class={{
+          'has-actions': this.hasActions,
+          'has-sources': this.hasSources,
+          'has-meta': hasMeta,
+        }}
+      >
+        <div class="message">
+          <slot></slot>
+        </div>
+        <div class="meta" aria-hidden={!hasMeta ? 'true' : undefined}>
+          <div class="actions">
+            <slot
+              name="actions"
+              onSlotchange={(event) => this.handleActionsSlotChange(event)}
+            ></slot>
+          </div>
+          <div class="sources">
+            <slot
+              name="sources"
+              onSlotchange={(event) => this.handleSourcesSlotChange(event)}
+            ></slot>
+          </div>
+        </div>
+      </Host>
+    );
+  }
+}
diff --git a/packages/core/src/components/chat-ai-message/tests/chat-ai-message.ct.ts b/packages/core/src/components/chat-ai-message/tests/chat-ai-message.ct.ts
new file mode 100644
index 00000000000..97e960dea00
--- /dev/null
+++ b/packages/core/src/components/chat-ai-message/tests/chat-ai-message.ct.ts
@@ -0,0 +1,71 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@playwright/test';
+import { regressionTest } from '@utils/test';
+
+regressionTest(
+  'ix-chat-ai-message renders slotted message content',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-ai-message>
+        <h3>Text block example</h3>
+        <p>Effective asset performance management improves uptime.</p>
+      </ix-chat-ai-message>
+    `);
+
+    const message = page.locator('ix-chat-ai-message');
+
+    await expect(message.locator('h3')).toContainText('Text block example');
+    await expect(message.locator('p')).toContainText(
+      'Effective asset performance management improves uptime.'
+    );
+    await expect(message.locator('.meta')).not.toBeVisible();
+  }
+);
+
+regressionTest(
+  'ix-chat-ai-message renders optional actions',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-ai-message>
+        <p>Analyze alarms</p>
+        <button slot="actions" aria-label="Copy">Copy</button>
+        <button slot="actions" aria-label="Regenerate">Regenerate</button>
+      </ix-chat-ai-message>
+    `);
+
+    const message = page.locator('ix-chat-ai-message');
+
+    await expect(message).toHaveClass(/has-actions/);
+    await expect(message.locator('.meta')).toBeVisible();
+    await expect(message.locator('.actions')).toBeVisible();
+    await expect(page.locator('button[slot="actions"]')).toHaveCount(2);
+  }
+);
+
+regressionTest(
+  'ix-chat-ai-message renders optional sources',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-ai-message>
+        <p>Analyze alarms</p>
+        <ix-pill slot="sources" outline variant="neutral">Sources</ix-pill>
+      </ix-chat-ai-message>
+    `);
+
+    const message = page.locator('ix-chat-ai-message');
+
+    await expect(message).toHaveClass(/has-sources/);
+    await expect(message.locator('.meta')).toBeVisible();
+    await expect(message.locator('.sources')).toBeVisible();
+    await expect(page.locator('ix-pill[slot="sources"]')).toContainText(
+      'Sources'
+    );
+  }
+);
diff --git a/packages/core/src/components/chat-input/chat-input.scss b/packages/core/src/components/chat-input/chat-input.scss
new file mode 100644
index 00000000000..0df12ff0298
--- /dev/null
+++ b/packages/core/src/components/chat-input/chat-input.scss
@@ -0,0 +1,209 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@use 'mixins/shadow-dom/component';
+@use 'mixins/scrollbar' as scrollbar;
+
+:host {
+  display: block;
+  width: 100%;
+
+  @include component.ix-component;
+
+  .chat-input {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    min-height: 8rem;
+    padding: var(--theme-space-2);
+    box-sizing: border-box;
+    background-color: var(--theme-input--background);
+    border: var(--theme-input--border-thickness) solid
+      var(--theme-input--border-color);
+    border-radius: var(--theme-input--border-radius);
+    box-shadow: var(--theme-input--box-shadow);
+    color: var(--theme-input--color);
+  }
+
+  .follow-up-prompts {
+    display: none;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    gap: var(--theme-space-1);
+    width: 100%;
+    margin-bottom: var(--theme-space-1);
+  }
+
+  .follow-up-prompts ::slotted(*) {
+    flex: 0 1 auto;
+  }
+
+  .follow-up-prompts ::slotted(ix-button) {
+    max-width: 25rem;
+    min-width: 5rem;
+  }
+
+  .follow-up-prompts ::slotted(ix-icon-button) {
+    flex: 0 0 auto;
+  }
+
+  .chat-input:hover {
+    border-color: var(--theme-input--border-color--hover);
+    background-color: var(--theme-input--background--hover);
+  }
+
+  .chat-input:focus-within {
+    outline: 1px solid var(--theme-color-focus-bdr);
+    outline-offset: var(--theme-input--focus--outline-offset);
+    border-color: var(--theme-input--border-color--focus);
+  }
+
+  .attachments {
+    display: none;
+    box-sizing: border-box;
+    width: 100%;
+    max-width: 100%;
+    gap: var(--theme-space-2);
+    margin-bottom: var(--theme-space-2);
+  }
+
+  .attachments.has-attachments {
+    display: flex;
+  }
+
+  .attachments--wrap {
+    flex-wrap: wrap;
+    max-height: calc(4rem + var(--theme-space-2));
+    overflow: hidden;
+  }
+
+  .attachments--scroll {
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+
+    @include scrollbar.scrollbar($include-current: true);
+  }
+
+  .attachments.has-attachment-scrollbar {
+    padding-bottom: 0.25rem;
+  }
+
+  .attachments ::slotted(ix-chat-prompt-attachment) {
+    flex: 0 1 auto;
+  }
+
+  .attachments--scroll ::slotted(ix-chat-prompt-attachment) {
+    flex: 0 0 auto;
+  }
+
+  textarea {
+    flex: 1 1 auto;
+    width: 100%;
+    min-height: 2rem;
+    padding: 0;
+    border: 0;
+    outline: 0;
+    box-sizing: border-box;
+    resize: none;
+    background: transparent;
+    color: inherit;
+    font: inherit;
+  }
+
+  textarea::placeholder {
+    color: var(--theme-input-hint--color);
+  }
+
+  .character-limit {
+    display: flex;
+    align-items: center;
+    gap: var(--theme-space-1);
+    width: 100%;
+    margin-top: var(--theme-space-2);
+  }
+
+  .character-limit ix-icon {
+    flex: 0 0 auto;
+  }
+
+  .character-limit--soft ix-icon {
+    color: var(--theme-color-info);
+  }
+
+  .character-limit--hard ix-icon {
+    color: var(--theme-color-warning);
+  }
+
+  .action-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    min-height: 2rem;
+    margin-top: var(--theme-space-1);
+  }
+
+  .left-actions,
+  .right-actions {
+    display: flex;
+    align-items: center;
+    gap: var(--theme-space-1);
+  }
+
+  .left-actions {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .right-actions {
+    flex: 0 0 auto;
+    justify-content: flex-end;
+  }
+
+  .disclaimer {
+    display: block;
+    width: 100%;
+    margin-top: var(--theme-space-1);
+    text-align: center;
+  }
+}
+
+:host(.has-follow-up) .follow-up-prompts {
+  display: flex;
+}
+
+:host(.disabled) {
+  pointer-events: none;
+
+  .chat-input {
+    border-color: var(--theme-input--border-color--disabled);
+    box-shadow: none;
+    color: var(--theme-input--color--disabled);
+    background-color: transparent;
+  }
+
+  textarea::placeholder {
+    color: transparent;
+  }
+}
+
+:host(.readonly) {
+  .chat-input {
+    border-color: var(--theme-input--border-color--readonly);
+    box-shadow: none;
+    background-color: transparent;
+  }
+
+  .chat-input:hover,
+  .chat-input:focus-within {
+    border-color: var(--theme-input--border-color--readonly);
+    outline: none;
+  }
+}
diff --git a/packages/core/src/components/chat-input/chat-input.tsx b/packages/core/src/components/chat-input/chat-input.tsx
new file mode 100644
index 00000000000..b329c29bdeb
--- /dev/null
+++ b/packages/core/src/components/chat-input/chat-input.tsx
@@ -0,0 +1,620 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  iconCircleStop,
+  iconInfo,
+  iconSendRightFilled,
+  iconWarning,
+} from '@siemens/ix-icons/icons';
+import {
+  AttachInternals,
+  Component,
+  Element,
+  Event,
+  EventEmitter,
+  Host,
+  Method,
+  Mixin,
+  Prop,
+  State,
+  Watch,
+  h,
+} from '@stencil/core';
+import { DefaultMixins } from '../utils/internal/component';
+import { ComponentIdMixin } from '../utils/internal/mixins/id.mixin';
+import { makeRef } from '../utils/make-ref';
+import { createMutationObserver } from '../utils/mutation-observer';
+import { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';
+
+/**
+ * @since 5.1.0
+ * @form-ready
+ * @slot follow-up - Optional refresh action and follow-up prompt buttons displayed above the chat input
+ * @slot attachments - Attachments displayed above the prompt text area
+ * @slot start - Element will be displayed in the left action area
+ * @slot end - Element will be displayed in the right action area before the submit button
+ */
+@Component({
+  tag: 'ix-chat-input',
+  styleUrl: 'chat-input.scss',
+  shadow: true,
+  formAssociated: true,
+})
+export class ChatInput extends Mixin(...DefaultMixins, ComponentIdMixin) {
+  @Element() override hostElement!: HTMLIxChatInputElement;
+  @AttachInternals() formInternals!: ElementInternals;
+
+  /**
+   * The state of the chat input, which can be either 'input' or 'processing'.
+   * @since 5.1.0
+   */
+  @Prop() state?: 'input' | 'processing' = 'input';
+
+  /**
+   * The name of the chat input.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) name?: string;
+
+  /**
+   * The placeholder text for the chat input.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) placeholder =
+    'Enter a command, question or topic...';
+
+  /**
+   * The value of the chat input.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true, mutable: true }) value: string = '';
+
+  /**
+   * Specifies whether the chat input is disabled.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) disabled: boolean = false;
+
+  /**
+   * Specifies whether the chat input is readonly.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) readonly: boolean = false;
+
+  /**
+   * Accessible label for the native textarea.
+   * @since 5.1.0
+   */
+  @Prop() textareaLabel: string = 'Chat input';
+
+  /**
+   * The maximum length of the chat input.
+   * @since 5.1.0
+   */
+  @Prop() maxLength?: number;
+
+  /**
+   * Character limit used for the optional inline character limit message.
+   * Falls back to `maxLength` when not set.
+   * @since 5.1.0
+   */
+  @Prop() characterLimit?: number;
+
+  /**
+   * i18n label for the hard character limit message.
+   * Use `{current}` and `{limit}` placeholders to place the values in any order.
+   * @since 5.1.0
+   */
+  // eslint-disable-next-line @stencil-community/decorators-style
+  @Prop({ attribute: 'i18n-character-limit-reached' })
+  i18nCharacterLimitReached =
+    'Character limit reached ({current} / {limit} characters)';
+
+  /**
+   * i18n label for the soft character limit warning.
+   * Use `{current}` and `{limit}` placeholders to place the values in any order.
+   * @since 5.1.0
+   */
+  // eslint-disable-next-line @stencil-community/decorators-style
+  @Prop({ attribute: 'i18n-character-limit-warning' })
+  i18nCharacterLimitWarning =
+    "You're nearing the limit ({current} / {limit} characters)";
+
+  /**
+   * Percentage of the character limit that triggers the soft warning. Define a number between 0 and 1 (e.g. 0.8 for 80%).
+   * @since 5.1.0
+   */
+  @Prop() characterLimitWarningThreshold: number = 0.9;
+
+  /**
+   * Minimum number of visible text rows.
+   * @since 5.1.0
+   */
+  @Prop() minRows: number = 1;
+
+  /**
+   * Maximum number of visible text rows before the input becomes scrollable.
+   * @since 5.1.0
+   */
+  @Prop() maxRows: number = 6;
+
+  /**
+   * If true, pressing Enter inserts a line break instead of submitting the prompt.
+   * @since 5.1.0
+   */
+  @Prop() insertLineBreakOnEnter: boolean = false;
+
+  /**
+   * Disclaimer text displayed below the chat input.
+   * @since 5.1.0
+   */
+  @Prop() disclaimer =
+    'This content is AI-generated. Always verify the information for accuracy.';
+
+  /**
+   * Event emitted when the value of the chat input changes.
+   * @since 5.1.0
+   */
+  @Event() valueChange!: EventEmitter<string>;
+
+  /**
+   * Event emitted when the chat input loses focus.
+   * @since 5.1.0
+   */
+  @Event() ixBlur!: EventEmitter<void>;
+
+  /**
+   * Event emitted when the chat input loses focus and the value has changed.
+   * @since 5.1.0
+   */
+  @Event() ixChange!: EventEmitter<string>;
+
+  /**
+   * Event emitted when the prompt is submitted by the send button or Enter key.
+   * @since 5.1.0
+   */
+  @Event() promptSubmit!: EventEmitter<string>;
+
+  /** @internal */
+  public initialValue?: string;
+
+  @State() hasAttachments = false;
+  @State() hasAttachmentScrollbar = false;
+  @State() hasFollowUp = false;
+
+  private readonly attachmentsRef = makeRef<HTMLDivElement>((attachments) => {
+    this.initAttachmentResizeObserver(attachments);
+    this.scheduleAttachmentScrollbarUpdate();
+  });
+  private readonly textareaRef = makeRef<HTMLTextAreaElement>((textarea) => {
+    this.updateTextareaHeight(textarea);
+  });
+  private attachmentResizeObserver?: ResizeObserver;
+  private attachmentMutationObserver?: MutationObserver;
+  private isAttachmentScrollbarUpdateQueued = false;
+
+  override componentWillLoad() {
+    super.componentWillLoad!();
+    this.updateFormInternalValue(this.value);
+    this.initialValue = this.value;
+    this.updateHasFollowUp();
+  }
+
+  override componentDidLoad() {
+    super.componentDidLoad!();
+    this.updateHasFollowUp();
+    this.initAttachmentMutationObserver();
+    this.scheduleAttachmentScrollbarUpdate();
+    this.updateTextareaHeight();
+  }
+
+  override componentDidRender() {
+    super.componentDidRender!();
+    this.scheduleAttachmentScrollbarUpdate();
+    this.updateTextareaHeight();
+  }
+
+  override disconnectedCallback() {
+    super.disconnectedCallback!();
+    this.attachmentResizeObserver?.disconnect();
+    this.attachmentMutationObserver?.disconnect();
+  }
+
+  @Watch('value')
+  onValueChange(value: string) {
+    this.formInternals.setFormValue(value);
+    this.updateTextareaHeight();
+  }
+
+  @Watch('minRows')
+  @Watch('maxRows')
+  onRowsChange() {
+    this.updateTextareaHeight();
+  }
+
+  updateFormInternalValue(value: string) {
+    this.formInternals.setFormValue(value);
+    this.value = value;
+  }
+
+  /** @internal */
+  @Method()
+  async getAssociatedFormElement(): Promise<HTMLFormElement | null> {
+    return this.formInternals.form;
+  }
+
+  /**
+   * Returns the native textarea element used by the chat input.
+   * @since 5.1.0
+   */
+  @Method()
+  async getNativeInputElement(): Promise<HTMLTextAreaElement> {
+    return this.textareaRef.waitForCurrent();
+  }
+
+  /**
+   * Focuses the chat input.
+   * @since 5.1.0
+   */
+  @Method()
+  async focusInput(): Promise<void> {
+    return (await this.getNativeInputElement()).focus();
+  }
+
+  private canSubmit() {
+    return !this.disabled && !this.readonly && this.value.trim().length > 0;
+  }
+
+  private emitIxChangeIfNeeded() {
+    if (this.initialValue !== this.value) {
+      this.ixChange.emit(this.value);
+      this.initialValue = this.value;
+    }
+  }
+
+  private submitPrompt() {
+    if (!this.canSubmit()) {
+      return;
+    }
+
+    this.emitIxChangeIfNeeded();
+    this.promptSubmit.emit(this.value);
+  }
+
+  private updateTextareaHeight(textarea = this.textareaRef.current) {
+    if (!textarea) {
+      return;
+    }
+
+    const computedStyle = getComputedStyle(textarea);
+    const lineHeight = Number.parseFloat(computedStyle.lineHeight) || 24;
+    const minRows = Math.max(this.minRows, 1);
+    const maxRows = Math.max(this.maxRows, minRows);
+    const borderHeight =
+      textarea.offsetHeight - textarea.clientHeight ||
+      Number.parseFloat(computedStyle.borderTopWidth) +
+        Number.parseFloat(computedStyle.borderBottomWidth);
+    const minHeight = lineHeight * minRows + borderHeight;
+    const maxHeight = lineHeight * maxRows + borderHeight;
+
+    textarea.style.height = 'auto';
+    textarea.style.minHeight = `${minHeight}px`;
+
+    const nextHeight = Math.min(
+      Math.max(textarea.scrollHeight + borderHeight, minHeight),
+      maxHeight
+    );
+
+    textarea.style.height = `${nextHeight}px`;
+    textarea.style.overflowY =
+      textarea.scrollHeight + borderHeight > maxHeight ? 'auto' : 'hidden';
+  }
+
+  private getCharacterLimit() {
+    const limit = this.characterLimit ?? this.maxLength;
+    return typeof limit === 'number' && Number.isFinite(limit) && limit > 0
+      ? limit
+      : undefined;
+  }
+
+  private getNormalizedCharacterLimitWarningThreshold() {
+    if (!Number.isFinite(this.characterLimitWarningThreshold)) {
+      return 0.9;
+    }
+
+    return Math.min(Math.max(this.characterLimitWarningThreshold, 0), 1);
+  }
+
+  private isSoftCharacterLimitWarning() {
+    const limit = this.getCharacterLimit();
+
+    if (!limit || this.isCharacterLimitReached()) {
+      return false;
+    }
+
+    const warningLength = Math.ceil(
+      limit * this.getNormalizedCharacterLimitWarningThreshold()
+    );
+
+    return this.value.length >= warningLength;
+  }
+
+  private isCharacterLimitReached() {
+    const limit = this.getCharacterLimit();
+
+    if (!limit) {
+      return false;
+    }
+
+    return this.value.length >= limit;
+  }
+
+  private getCharacterLimitMessage() {
+    const limit = this.getCharacterLimit();
+    const current = this.value.length;
+
+    if (!limit) {
+      return undefined;
+    }
+
+    if (this.isCharacterLimitReached()) {
+      return this.formatCharacterLimitMessage(
+        this.i18nCharacterLimitReached,
+        current,
+        limit
+      );
+    }
+
+    if (this.isSoftCharacterLimitWarning()) {
+      return this.formatCharacterLimitMessage(
+        this.i18nCharacterLimitWarning,
+        current,
+        limit
+      );
+    }
+
+    return undefined;
+  }
+
+  private formatCharacterLimitMessage(
+    template: string,
+    current: number,
+    limit: number
+  ) {
+    return template
+      .split('{current}')
+      .join(String(current))
+      .split('{limit}')
+      .join(String(limit));
+  }
+
+  private getCharacterLimitState(): 'soft' | 'hard' | undefined {
+    if (this.isCharacterLimitReached()) {
+      return 'hard';
+    }
+
+    if (this.isSoftCharacterLimitWarning()) {
+      return 'soft';
+    }
+
+    return undefined;
+  }
+
+  private handleKeyDown(event: KeyboardEvent) {
+    if (
+      event.key !== 'Enter' ||
+      event.shiftKey ||
+      event.altKey ||
+      event.ctrlKey ||
+      event.metaKey ||
+      this.insertLineBreakOnEnter ||
+      this.state === 'processing'
+    ) {
+      return;
+    }
+
+    event.preventDefault();
+    this.submitPrompt();
+  }
+
+  private renderCharacterLimit() {
+    const message = this.getCharacterLimitMessage();
+    const state = this.getCharacterLimitState();
+
+    if (!message || !state) {
+      return null;
+    }
+
+    return (
+      <ix-typography
+        class={{
+          'character-limit': true,
+          'character-limit--soft': state === 'soft',
+          'character-limit--hard': state === 'hard',
+        }}
+        textColor={'std'}
+      >
+        <ix-icon
+          aria-hidden="true"
+          name={state === 'hard' ? iconWarning : iconInfo}
+          size="16"
+        ></ix-icon>
+        {message}
+      </ix-typography>
+    );
+  }
+
+  private handleAttachmentsSlotChange(event: Event) {
+    const slot = event.target as HTMLSlotElement;
+    this.hasAttachments =
+      slot.assignedElements({
+        flatten: true,
+      }).length > 0;
+    this.scheduleAttachmentScrollbarUpdate();
+  }
+
+  private handleFollowUpSlotChange(event: Event) {
+    this.hasFollowUp = this.hasAssignedContent(event.target as HTMLSlotElement);
+  }
+
+  private hasAssignedContent(slot: HTMLSlotElement) {
+    return slot.assignedNodes({ flatten: true }).some((node) => {
+      return node.nodeType === 1 || !!node.textContent?.trim();
+    });
+  }
+
+  private updateHasFollowUp() {
+    this.hasFollowUp =
+      this.hostElement.querySelectorAll('[slot="follow-up"]').length > 0;
+  }
+
+  private initAttachmentResizeObserver(attachments: HTMLDivElement) {
+    this.attachmentResizeObserver?.disconnect();
+    this.attachmentResizeObserver = new ResizeObserver(() =>
+      this.scheduleAttachmentScrollbarUpdate()
+    );
+    this.attachmentResizeObserver.observe(attachments);
+  }
+
+  private initAttachmentMutationObserver() {
+    this.attachmentMutationObserver = createMutationObserver(() => {
+      this.updateHasFollowUp();
+      this.scheduleAttachmentScrollbarUpdate();
+    });
+    this.attachmentMutationObserver.observe(this.hostElement, {
+      attributes: true,
+      childList: true,
+      subtree: true,
+    });
+  }
+
+  private scheduleAttachmentScrollbarUpdate() {
+    if (this.isAttachmentScrollbarUpdateQueued) {
+      return;
+    }
+
+    this.isAttachmentScrollbarUpdateQueued = true;
+    requestAnimationFrameNoNgZone(() => {
+      this.isAttachmentScrollbarUpdateQueued = false;
+      this.updateAttachmentScrollbar();
+    });
+  }
+
+  private updateAttachmentScrollbar() {
+    const attachments = this.attachmentsRef.current;
+    if (!attachments) {
+      return;
+    }
+
+    const computedStyle = getComputedStyle(attachments);
+    const hasHorizontalScrollbar =
+      ['auto', 'scroll'].includes(computedStyle.overflowX) &&
+      attachments.scrollWidth - attachments.clientWidth > 1;
+    const hasVerticalScrollbar =
+      ['auto', 'scroll'].includes(computedStyle.overflowY) &&
+      attachments.scrollHeight - attachments.clientHeight > 1;
+    const hasAttachmentScrollbar =
+      this.hasAttachments && (hasHorizontalScrollbar || hasVerticalScrollbar);
+
+    if (this.hasAttachmentScrollbar !== hasAttachmentScrollbar) {
+      this.hasAttachmentScrollbar = hasAttachmentScrollbar;
+    }
+  }
+
+  override render() {
+    const isProcessing = this.state === 'processing';
+    const disabledSubmitButton =
+      isProcessing || (!this.canSubmit() && this.state === 'input');
+    const submitButtonIcon = isProcessing
+      ? iconCircleStop
+      : iconSendRightFilled;
+
+    return (
+      <Host
+        class={{
+          disabled: this.disabled,
+          readonly: this.readonly,
+          'has-follow-up': this.hasFollowUp,
+        }}
+      >
+        <div class="follow-up-prompts">
+          <slot
+            name="follow-up"
+            onSlotchange={(event) => this.handleFollowUpSlotChange(event)}
+          ></slot>
+        </div>
+        <div class="chat-input">
+          <div
+            ref={this.attachmentsRef}
+            class={{
+              attachments: true,
+              'attachments--scroll': true,
+              'has-attachment-scrollbar': this.hasAttachmentScrollbar,
+              'has-attachments': this.hasAttachments,
+            }}
+          >
+            <slot
+              name="attachments"
+              onSlotchange={(event) => this.handleAttachmentsSlotChange(event)}
+            ></slot>
+          </div>
+          <textarea
+            id={this.getHostElementId() + '-textarea'}
+            ref={this.textareaRef}
+            readOnly={this.readonly}
+            disabled={this.disabled}
+            maxLength={this.getCharacterLimit()}
+            rows={this.minRows}
+            value={this.value}
+            placeholder={this.placeholder}
+            aria-label={this.textareaLabel}
+            onFocus={() => {
+              this.initialValue = this.value;
+            }}
+            onInput={(event) => {
+              const textarea = event.target as HTMLTextAreaElement;
+              this.updateFormInternalValue(textarea.value);
+              this.valueChange.emit(textarea.value);
+              this.updateTextareaHeight(textarea);
+            }}
+            onKeyDown={(event) => this.handleKeyDown(event)}
+            onBlur={() => {
+              this.ixBlur.emit();
+              this.emitIxChangeIfNeeded();
+            }}
+          ></textarea>
+          {this.renderCharacterLimit()}
+          <div class="action-row">
+            <div class="left-actions">
+              <slot name="start"></slot>
+            </div>
+            <div class="right-actions">
+              <slot name="end"></slot>
+              <ix-icon-button
+                aria-label={isProcessing ? 'Stop processing' : 'Submit prompt'}
+                class="submit-button"
+                disabled={disabledSubmitButton}
+                icon={submitButtonIcon}
+                size="24"
+                variant="tertiary"
+                onClick={() => this.submitPrompt()}
+              ></ix-icon-button>
+            </div>
+          </div>
+        </div>
+        {this.disclaimer && (
+          <ix-typography class="disclaimer" format="body-sm" textColor="soft">
+            {this.disclaimer}
+          </ix-typography>
+        )}
+      </Host>
+    );
+  }
+}
diff --git a/packages/core/src/components/chat-input/tests/chat-input.ct.ts b/packages/core/src/components/chat-input/tests/chat-input.ct.ts
new file mode 100644
index 00000000000..32fa8d908f7
--- /dev/null
+++ b/packages/core/src/components/chat-input/tests/chat-input.ct.ts
@@ -0,0 +1,396 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@playwright/test';
+import { iconCircleStop, iconSendRightFilled } from '@siemens/ix-icons/icons';
+import {
+  getFormValue,
+  preventFormSubmission,
+  regressionTest,
+} from '@utils/test';
+
+declare global {
+  var __promptSubmitValue: string | undefined;
+}
+
+type ValueChangeTestElement = HTMLElement & {
+  __valueChange?: string;
+};
+
+function getSubmitButtonIcon(element: Element) {
+  return (element as HTMLIxIconButtonElement).icon;
+}
+
+regressionTest('renders', async ({ mount, page }) => {
+  await mount('<ix-chat-input></ix-chat-input>');
+  await expect(page.locator('ix-chat-input')).toHaveClass(/\bhydrated\b/);
+});
+
+regressionTest('accessibility', async ({ mount, makeAxeBuilder }) => {
+  await mount('<ix-chat-input></ix-chat-input>');
+  const accessibilityScanResults = await makeAxeBuilder()
+    .include('ix-chat-input')
+    .analyze();
+  expect(accessibilityScanResults.violations).toEqual([]);
+});
+
+regressionTest(
+  'ix-chat-input emits valueChange when text is entered',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input></ix-chat-input>');
+
+    const chatInput = page.locator('ix-chat-input');
+    await chatInput.evaluate((element) => {
+      const testElement = element as ValueChangeTestElement;
+      testElement.__valueChange = undefined;
+      element.addEventListener('valueChange', ((event: CustomEvent<string>) => {
+        testElement.__valueChange = event.detail;
+      }) as EventListener);
+    });
+
+    await chatInput.locator('textarea').fill('Show pump status');
+
+    await expect(chatInput).toHaveAttribute('value', 'Show pump status');
+    const emittedValue = await chatInput.evaluate(
+      (element) => (element as ValueChangeTestElement).__valueChange
+    );
+    expect(emittedValue).toBe('Show pump status');
+  }
+);
+
+regressionTest(
+  'ix-chat-input disables submit button while prompt is empty',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input></ix-chat-input>');
+
+    const submitButton = page
+      .locator('ix-chat-input')
+      .locator('ix-icon-button.submit-button');
+
+    await expect(submitButton).toHaveClass(/disabled/);
+  }
+);
+
+regressionTest(
+  'ix-chat-input emits promptSubmit on submit button click',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input value="Analyze alarms"></ix-chat-input>');
+
+    await page.evaluate(() => {
+      globalThis.__promptSubmitValue = undefined;
+      document
+        .querySelector('ix-chat-input')
+        ?.addEventListener('promptSubmit', ((event: CustomEvent<string>) => {
+          globalThis.__promptSubmitValue = event.detail;
+        }) as EventListener);
+    });
+
+    await page
+      .locator('ix-chat-input')
+      .locator('ix-icon-button.submit-button')
+      .click();
+
+    const submittedValue = await page.evaluate(
+      () => globalThis.__promptSubmitValue
+    );
+    expect(submittedValue).toBe('Analyze alarms');
+  }
+);
+
+regressionTest(
+  'ix-chat-input emits promptSubmit on Enter but not Shift Enter',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input value="Analyze alarms"></ix-chat-input>');
+
+    await page.evaluate(() => {
+      globalThis.__promptSubmitValue = undefined;
+      document
+        .querySelector('ix-chat-input')
+        ?.addEventListener('promptSubmit', ((event: CustomEvent<string>) => {
+          globalThis.__promptSubmitValue = event.detail;
+        }) as EventListener);
+    });
+
+    const textarea = page.locator('ix-chat-input').locator('textarea');
+    await textarea.focus();
+    await textarea.press('Shift+Enter');
+    expect(await page.evaluate(() => globalThis.__promptSubmitValue)).toBe(
+      undefined
+    );
+
+    await textarea.fill('Analyze alarms');
+    await textarea.press('Enter');
+
+    const submittedValue = await page.evaluate(
+      () => globalThis.__promptSubmitValue
+    );
+    expect(submittedValue).toBe('Analyze alarms');
+  }
+);
+
+regressionTest(
+  'ix-chat-input does not render default slot actions',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input></ix-chat-input>');
+
+    const chatInput = page.locator('ix-chat-input');
+
+    await expect(chatInput.locator('.left-actions ix-icon-button')).toHaveCount(
+      0
+    );
+    await expect(
+      chatInput.locator('.right-actions ix-icon-button')
+    ).toHaveCount(1);
+  }
+);
+
+regressionTest(
+  'ix-chat-input switches the submit action icon for the processing state',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input value="Analyze alarms"></ix-chat-input>');
+
+    const chatInput = page.locator('ix-chat-input');
+    const submitButton = chatInput.locator('ix-icon-button.submit-button');
+
+    await expect
+      .poll(() => submitButton.evaluate(getSubmitButtonIcon))
+      .toBe(iconSendRightFilled);
+
+    await chatInput.evaluate((element) => {
+      (element as HTMLIxChatInputElement).state = 'processing';
+    });
+
+    await expect
+      .poll(() => submitButton.evaluate(getSubmitButtonIcon))
+      .toBe(iconCircleStop);
+  }
+);
+
+regressionTest(
+  'ix-chat-input shows a soft character limit warning from the threshold',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-input max-length="10" character-limit-warning-threshold="0.9" value="123456789"></ix-chat-input>'
+    );
+
+    const chatInput = page.locator('ix-chat-input');
+
+    await expect(chatInput.locator('.character-limit')).toContainText(
+      "You're nearing the limit (9 / 10 characters)"
+    );
+    expect(await chatInput.locator('textarea').getAttribute('maxlength')).toBe(
+      '10'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-input supports a translated soft character limit warning',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input
+        max-length="10"
+        character-limit-warning-threshold="0.9"
+        i18n-character-limit-warning="{limit} Zeichen, {current} eingegeben"
+        value="123456789"
+      ></ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+
+    await expect(chatInput.locator('.character-limit')).toContainText(
+      '10 Zeichen, 9 eingegeben'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-input supports a translated soft character limit warning with custom placeholders',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input
+        max-length="10"
+        character-limit-warning-threshold="0.9"
+        i18n-character-limit-warning="Warning a limit is near!"
+        value="123456789"
+      ></ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+
+    await expect(chatInput.locator('.character-limit')).toContainText(
+      'Warning a limit is near!'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-input shows an error when the character limit is reached',
+  async ({ mount, page }) => {
+    await mount('<ix-chat-input max-length="10"></ix-chat-input>');
+
+    const chatInput = page.locator('ix-chat-input');
+    const textarea = chatInput.locator('textarea');
+
+    await textarea.fill('1234567890');
+
+    await expect(textarea).toHaveValue('1234567890');
+    const characterLimit = chatInput.locator('.character-limit');
+    await expect(characterLimit).toHaveClass(/character-limit--hard/);
+    await expect(characterLimit).toContainText(
+      'Character limit reached (10 / 10 characters)'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-input supports a translated hard character limit message',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input
+        max-length="10"
+        i18n-character-limit-reached="{current} von {limit} Zeichen erreicht"
+      ></ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+    const textarea = chatInput.locator('textarea');
+
+    await textarea.fill('1234567890');
+
+    await expect(chatInput.locator('.character-limit')).toContainText(
+      '10 von 10 Zeichen erreicht'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-input renders slotted attachments with selected layout',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input attachment-layout="scroll" style="width: 40rem; --ix-chat-input-max-width: 40rem">
+        <ix-chat-prompt-attachment slot="attachments" file-name="file_01.txt"></ix-chat-prompt-attachment>
+        <ix-chat-prompt-attachment slot="attachments" status="loading"></ix-chat-prompt-attachment>
+      </ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+
+    await expect(chatInput.locator('.attachments')).toHaveClass(
+      /has-attachments/
+    );
+    await expect(chatInput.locator('.attachments')).toHaveClass(
+      /attachments--scroll/
+    );
+    await expect(chatInput.locator('.attachments')).not.toHaveClass(
+      /has-attachment-scrollbar/
+    );
+    await expect(
+      page.locator('ix-chat-prompt-attachment[slot="attachments"]')
+    ).toHaveCount(2);
+  }
+);
+
+regressionTest(
+  'ix-chat-input adds scrollbar spacing only when attachments are scrollable',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input attachment-layout="scroll" style="width: 12rem; --ix-chat-input-max-width: 12rem">
+        ${Array.from(
+          { length: 8 },
+          (_, index) =>
+            `<ix-chat-prompt-attachment slot="attachments" file-name="file_${String(
+              index + 1
+            ).padStart(2, '0')}.txt"></ix-chat-prompt-attachment>`
+        ).join('')}
+      </ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+    const attachments = chatInput.locator('.attachments');
+
+    await expect(attachments).toHaveClass(/has-attachment-scrollbar/);
+    await expect(attachments).toHaveCSS('padding-bottom', '4px');
+
+    await chatInput.evaluate((element) => {
+      element.style.width = '90rem';
+      element.style.setProperty('--ix-chat-input-max-width', '90rem');
+    });
+
+    await expect(attachments).not.toHaveClass(/has-attachment-scrollbar/);
+  }
+);
+
+regressionTest(
+  'ix-chat-input does not render an attachment overflow dropdown',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input style="width: 16rem; --ix-chat-input-max-width: 16rem">
+        ${Array.from(
+          { length: 10 },
+          (_, index) =>
+            `<ix-chat-prompt-attachment slot="attachments" file-name="file_${String(
+              index + 1
+            ).padStart(2, '0')}.txt"></ix-chat-prompt-attachment>`
+        ).join('')}
+      </ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+    await expect(
+      chatInput.locator('ix-dropdown-button.attachment-overflow')
+    ).toHaveCount(0);
+    await expect(chatInput.locator('.attachments')).not.toHaveClass(
+      /has-attachment-scrollbar/
+    );
+    await expect(
+      page.locator('[data-attachment-overflow-generated]')
+    ).toHaveCount(0);
+    await expect(
+      page.locator('ix-chat-prompt-attachment[slot="attachments"]')
+    ).toHaveCount(10);
+  }
+);
+
+regressionTest(
+  'ix-chat-input renders slotted follow-up actions above the input',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-input>
+        <button slot="follow-up" aria-label="Refresh follow-up prompts">Refresh</button>
+        <ix-button slot="follow-up" variant="secondary">What are the risks if this insight is ignored?</ix-button>
+        <ix-button slot="follow-up" variant="secondary">Show related insights from similar customer events.</ix-button>
+      </ix-chat-input>
+    `);
+
+    const chatInput = page.locator('ix-chat-input');
+    const followUp = chatInput.locator('.follow-up-prompts');
+
+    await expect(chatInput).toHaveClass(/has-follow-up/);
+    await expect(followUp).toBeVisible();
+    await expect(page.locator('[slot="follow-up"]')).toHaveCount(3);
+    await expect(
+      page.locator('ix-button[slot="follow-up"]').first()
+    ).toContainText('What are the risks if this insight is ignored?');
+  }
+);
+
+regressionTest(`form-ready - ix-chat-input`, async ({ mount, page }) => {
+  await mount(
+    `<form><ix-chat-input name="my-field-name"></ix-chat-input></form>`
+  );
+
+  const formElement = page.locator('form');
+  preventFormSubmission(formElement);
+  const input = page.locator('ix-chat-input').locator('textarea');
+  await input.fill('Some prompt');
+  await input.blur();
+
+  const formData = await getFormValue(formElement, 'my-field-name', page);
+  expect(formData).toBe('Some prompt');
+});
diff --git a/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.scss b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.scss
new file mode 100644
index 00000000000..b55c2637be6
--- /dev/null
+++ b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.scss
@@ -0,0 +1,88 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@use 'mixins/shadow-dom/component';
+
+:host {
+  display: inline-block;
+
+  @include component.ix-component;
+
+  .attachment-chip {
+    display: block;
+    width: 100%;
+    max-width: 20rem;
+  }
+
+  .content,
+  .status-content {
+    display: inline-flex;
+    align-items: center;
+    min-width: 0;
+  }
+
+  .content {
+    flex: 1 1 auto;
+    max-width: 100%;
+    width: 100%;
+  }
+
+  .status-content {
+    gap: var(--theme-space-1);
+  }
+
+  .status-content ix-spinner {
+    scale: 1.7;
+    margin-left: 0.1875rem;
+  }
+
+  .file-name {
+    display: inline-flex;
+    flex: 1 1 auto;
+    min-width: 0;
+    max-width: 100%;
+    overflow: hidden;
+  }
+
+  .file-name__base {
+    flex: 1 1 auto;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: end;
+  }
+
+  .file-name__extension {
+    flex: 0 0 auto;
+    white-space: nowrap;
+  }
+
+  .status-label {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  ix-icon {
+    flex: 0 0 auto;
+  }
+
+  ix-spinner {
+    flex: 0 0 auto;
+  }
+}
+
+:host(.preview-supported) {
+  cursor: pointer;
+}
+
+:host(.has-remove-button) {
+  gap: var(--theme-space-0);
+}
diff --git a/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.tsx b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.tsx
new file mode 100644
index 00000000000..416c2024171
--- /dev/null
+++ b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.tsx
@@ -0,0 +1,177 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { iconError, iconTxtDocument } from '@siemens/ix-icons/icons';
+import { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core';
+import type { ChatPromptAttachmentStatus } from './chat-prompt-attachment.types';
+
+/**
+ * @since 5.1.0
+ */
+@Component({
+  tag: 'ix-chat-prompt-attachment',
+  styleUrl: 'chat-prompt-attachment.scss',
+  shadow: true,
+})
+export class ChatPromptAttachment {
+  /**
+   * Name of the attached file.
+   * @since 5.1.0
+   */
+  @Prop() fileName: string = '';
+
+  /**
+   * Upload status of the attachment.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) status: ChatPromptAttachmentStatus = 'default';
+
+  /**
+   * Icon displayed before the file name.
+   * @since 5.1.0
+   */
+  @Prop() icon: string = iconTxtDocument;
+
+  /**
+   * Hide the remove action.
+   * @since 5.1.0
+   */
+  @Prop() hideRemoveButton: boolean = false;
+
+  /**
+   * Enable preview interaction for default attachments.
+   * @since 5.1.0
+   */
+  @Prop({ reflect: true }) previewSupported: boolean = false;
+
+  /**
+   * Accessible label for the remove action.
+   * @since 5.1.0
+   */
+  @Prop() removeAriaLabel: string = 'Remove attachment';
+
+  /**
+   * Event emitted when the attachment is clicked.
+   * @since 5.1.0
+   */
+  @Event() attachmentClick!: EventEmitter<void>;
+
+  /**
+   * Event emitted when the remove action is clicked.
+   * @since 5.1.0
+   */
+  @Event() removeClick!: EventEmitter<void>;
+
+  private canPreview() {
+    return this.previewSupported && this.status === 'default';
+  }
+
+  private splitFileName() {
+    const fileName = this.fileName.trim();
+    const extensionStart = fileName.lastIndexOf('.');
+
+    if (extensionStart <= 0 || extensionStart === fileName.length - 1) {
+      return { name: fileName, extension: '' };
+    }
+
+    return {
+      name: fileName.slice(0, extensionStart),
+      extension: fileName.slice(extensionStart),
+    };
+  }
+
+  private renderFileName() {
+    const { name, extension } = this.splitFileName();
+
+    return (
+      <span class="file-name" title={this.fileName}>
+        <span class="file-name__base">{name || this.fileName}</span>
+        {!!extension && <span class="file-name__extension">{extension}</span>}
+      </span>
+    );
+  }
+
+  private getChipVariant() {
+    if (this.status === 'failed') {
+      return 'alarm';
+    }
+
+    return 'neutral';
+  }
+
+  private renderChipContent() {
+    if (this.status === 'loading') {
+      return (
+        <span class="status-content">
+          <ix-spinner size="xx-small" variant="primary"></ix-spinner>
+          <span class="status-label">{this.fileName}</span>
+        </span>
+      );
+    }
+
+    if (this.status === 'failed') {
+      return <span class="status-label">{this.fileName}</span>;
+    }
+
+    return this.renderFileName();
+  }
+
+  private handleAttachmentClick() {
+    if (this.canPreview()) {
+      this.attachmentClick.emit();
+    }
+  }
+
+  private getIcon() {
+    if (this.status === 'default') {
+      return this.icon;
+    }
+
+    if (this.status === 'loading') {
+      return undefined;
+    }
+
+    if (this.status === 'failed') {
+      return iconError;
+    }
+
+    return this.icon;
+  }
+
+  render() {
+    const isFailed = this.status === 'failed';
+    const isLoading = this.status === 'loading';
+    const canPreview = this.canPreview();
+    return (
+      <Host
+        class={{
+          failed: isFailed,
+          loading: isLoading,
+          'preview-supported': canPreview,
+          'has-remove-button': !this.hideRemoveButton,
+        }}
+      >
+        <ix-chip
+          aria-label={canPreview ? this.fileName : undefined}
+          ariaLabelCloseButton={this.removeAriaLabel}
+          class="attachment-chip"
+          closable={!this.hideRemoveButton}
+          icon={this.getIcon()}
+          variant={this.getChipVariant()}
+          outline
+          onClick={() => this.handleAttachmentClick()}
+          onCloseChip={() => this.removeClick.emit()}
+          inactive={!canPreview}
+        >
+          <span class="content">{this.renderChipContent()}</span>
+        </ix-chip>
+      </Host>
+    );
+  }
+}
diff --git a/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.types.ts b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.types.ts
new file mode 100644
index 00000000000..8e96014633a
--- /dev/null
+++ b/packages/core/src/components/chat-prompt-attachment/chat-prompt-attachment.types.ts
@@ -0,0 +1,10 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export type ChatPromptAttachmentStatus = 'default' | 'loading' | 'failed';
diff --git a/packages/core/src/components/chat-prompt-attachment/tests/chat-prompt-attachment.ct.ts b/packages/core/src/components/chat-prompt-attachment/tests/chat-prompt-attachment.ct.ts
new file mode 100644
index 00000000000..8b86335123d
--- /dev/null
+++ b/packages/core/src/components/chat-prompt-attachment/tests/chat-prompt-attachment.ct.ts
@@ -0,0 +1,188 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@playwright/test';
+import { regressionTest } from '@utils/test';
+
+declare global {
+  var __attachmentClicked: boolean | undefined;
+  var __attachmentRemoveClicked: boolean | undefined;
+}
+
+regressionTest(
+  'ix-chat-prompt-attachment renders a default file attachment',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-prompt-attachment file-name="meeting_notes_summary_01.txt"></ix-chat-prompt-attachment>'
+    );
+
+    const attachment = page.locator('ix-chat-prompt-attachment');
+
+    await expect(attachment.locator('.file-name__base')).toContainText(
+      'meeting_notes_summary_01'
+    );
+    await expect(attachment.locator('.file-name__extension')).toContainText(
+      '.txt'
+    );
+    await expect(attachment.locator('ix-chip')).toHaveCount(1);
+    await expect(attachment.locator('ix-chip')).toHaveJSProperty(
+      'closable',
+      true
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-prompt-attachment truncates long file names with an ellipsis',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-prompt-attachment file-name="Long File Name of chat prompt attachment with many details.txt"></ix-chat-prompt-attachment>'
+    );
+
+    const attachment = page.locator('ix-chat-prompt-attachment');
+    const fileNameBase = attachment.locator('.file-name__base');
+    const fileNameExtension = attachment.locator('.file-name__extension');
+    const closeButton = attachment.locator('ix-chip').locator('.chip-close');
+
+    await expect(fileNameBase).toContainText(
+      'Long File Name of chat prompt attachment with many details'
+    );
+
+    const getOverflowState = () =>
+      fileNameBase.evaluate((element) => {
+        const style = getComputedStyle(element);
+
+        return {
+          clientWidth: element.clientWidth,
+          overflow: style.overflow,
+          rectWidth: element.getBoundingClientRect().width,
+          scrollWidth: element.scrollWidth,
+          textOverflow: style.textOverflow,
+          whiteSpace: style.whiteSpace,
+        };
+      });
+
+    await expect
+      .poll(async () => {
+        const state = await getOverflowState();
+        return state.scrollWidth > state.clientWidth && state.clientWidth > 0;
+      })
+      .toBe(true);
+
+    const overflowState = await getOverflowState();
+    expect(overflowState.overflow).toBe('hidden');
+    expect(overflowState.textOverflow).toBe('ellipsis');
+    expect(overflowState.whiteSpace).toBe('nowrap');
+
+    await expect(fileNameExtension).toContainText('.txt');
+    await expect(closeButton).toBeVisible();
+  }
+);
+
+regressionTest(
+  'ix-chat-prompt-attachment renders loading and failed states',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-prompt-attachment file-name="uploading_file.txt" status="loading"></ix-chat-prompt-attachment>
+      <ix-chat-prompt-attachment file-name="failed_file.txt" status="failed"></ix-chat-prompt-attachment>
+    `);
+
+    await expect(
+      page.locator('ix-chat-prompt-attachment').first().locator('ix-spinner')
+    ).toHaveCount(1);
+    await expect(
+      page.locator('ix-chat-prompt-attachment').first()
+    ).toContainText('uploading_file.txt');
+
+    await expect(
+      page.locator('ix-chat-prompt-attachment').nth(1)
+    ).toContainText('failed_file.txt');
+    await expect(
+      page.locator('ix-chat-prompt-attachment').nth(1).locator('ix-chip')
+    ).toHaveAttribute('variant', 'alarm');
+  }
+);
+
+regressionTest(
+  'ix-chat-prompt-attachment emits attachmentClick only when preview is supported',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-prompt-attachment file-name="static_file.txt"></ix-chat-prompt-attachment>
+      <ix-chat-prompt-attachment file-name="preview_file.txt" preview-supported></ix-chat-prompt-attachment>
+    `);
+
+    await page.evaluate(() => {
+      globalThis.__attachmentClicked = false;
+      document
+        .querySelectorAll('ix-chat-prompt-attachment')
+        .forEach((attachment) => {
+          attachment.addEventListener('attachmentClick', () => {
+            globalThis.__attachmentClicked = true;
+          });
+        });
+    });
+
+    const staticAttachment = page.locator('ix-chat-prompt-attachment').first();
+    const previewAttachment = page.locator('ix-chat-prompt-attachment').nth(1);
+
+    await staticAttachment.click();
+    expect(await page.evaluate(() => globalThis.__attachmentClicked)).toBe(
+      false
+    );
+
+    await previewAttachment.click();
+    expect(await page.evaluate(() => globalThis.__attachmentClicked)).toBe(
+      true
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-prompt-attachment renders sent variant compactly',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-prompt-attachment file-name="file_01.pdf" variant="sent" hide-remove-button preview-supported></ix-chat-prompt-attachment>'
+    );
+
+    const attachment = page.locator('ix-chat-prompt-attachment');
+
+    await expect(attachment.locator('ix-chip')).toHaveAttribute(
+      'variant',
+      'neutral'
+    );
+    await expect(attachment.locator('ix-chip')).toHaveJSProperty(
+      'closable',
+      false
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-prompt-attachment emits removeClick from the chip close action',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-prompt-attachment file-name="file_01.txt"></ix-chat-prompt-attachment>'
+    );
+
+    await page.evaluate(() => {
+      globalThis.__attachmentRemoveClicked = false;
+      const attachment = document.querySelector('ix-chat-prompt-attachment');
+
+      attachment?.addEventListener('removeClick', () => {
+        globalThis.__attachmentRemoveClicked = true;
+      });
+    });
+
+    const attachment = page.locator('ix-chat-prompt-attachment');
+    await attachment.locator('ix-chip').locator('.chip-close').click();
+
+    await expect
+      .poll(() => page.evaluate(() => globalThis.__attachmentRemoveClicked))
+      .toBe(true);
+  }
+);
diff --git a/packages/core/src/components/chat-user-message/chat-user-message.scss b/packages/core/src/components/chat-user-message/chat-user-message.scss
new file mode 100644
index 00000000000..aa7997ae67e
--- /dev/null
+++ b/packages/core/src/components/chat-user-message/chat-user-message.scss
@@ -0,0 +1,99 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@use 'mixins/shadow-dom/component';
+@use './mixins/action.mixin';
+
+:host {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+
+  @include component.ix-component;
+
+  .message {
+    width: fit-content;
+    min-width: max(15.375rem, 45%);
+    max-width: 80%;
+    box-sizing: border-box;
+    padding: var(--theme-space-2) var(--theme-space-3);
+    border-radius: var(--theme-default-border-radius);
+    background-color: var(--theme-color-component-8);
+    color: var(--theme-color-std-text);
+  }
+
+  .attachments {
+    display: none;
+    justify-content: flex-end;
+    flex-wrap: wrap;
+    gap: var(--theme-space-1) 0;
+    width: 100%;
+    max-width: 75%;
+    margin-bottom: var(--theme-space-1);
+    overflow: hidden;
+  }
+
+  .attachments ::slotted(ix-chat-prompt-attachment) {
+    flex: 0 1 6.375rem;
+    padding-left: var(--theme-space-1);
+  }
+
+  .attachment-overflow {
+    margin-bottom: var(--theme-space-1);
+    --ix-dropdown-button-border-radius-left: var(--theme-small-border-radius);
+    --ix-dropdown-button-border-radius-right: var(--theme-small-border-radius);
+  }
+
+  .message-text {
+    display: block;
+    overflow-wrap: anywhere;
+    white-space: pre-wrap;
+  }
+
+  .actions {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--theme-space-1);
+    min-height: 2rem;
+    margin-top: var(--theme-space-1);
+
+    @include action.animate-action;
+  }
+
+  .actions ::slotted(ix-icon-button) {
+    flex: 0 0 auto;
+  }
+}
+
+:host(.has-attachments) {
+  .attachments {
+    display: flex;
+  }
+}
+
+:host(:focus-visible) {
+  outline: none;
+
+  .message {
+    outline: 1px solid var(--theme-color-focus-bdr);
+    outline-offset: var(--theme-focus-outline-offset);
+  }
+}
+
+:host(.has-actions:focus),
+:host(.has-actions:hover),
+:host(.has-actions:focus-within) {
+  .actions {
+    @include action.show-action;
+  }
+}
diff --git a/packages/core/src/components/chat-user-message/chat-user-message.tsx b/packages/core/src/components/chat-user-message/chat-user-message.tsx
new file mode 100644
index 00000000000..ddd0dbebdae
--- /dev/null
+++ b/packages/core/src/components/chat-user-message/chat-user-message.tsx
@@ -0,0 +1,121 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component, Element, Host, Prop, State, h } from '@stencil/core';
+
+/**
+ * @since 5.1.0
+ * @slot - Message content displayed in the user message bubble
+ * @slot actions - Optional actions displayed below the user message bubble
+ * @slot attachments - ix-chat-prompt-attachment elements with variant="sent" displayed above the user message bubble
+ */
+@Component({
+  tag: 'ix-chat-user-message',
+  styleUrl: 'chat-user-message.scss',
+  shadow: true,
+})
+export class ChatUserMessage {
+  @Element() hostElement!: HTMLIxChatUserMessageElement;
+
+  /**
+   * Text displayed in the user message bubble.
+   * @since 5.1.0
+   */
+  @Prop() message?: string;
+
+  @State() hasActions = false;
+  @State() hasAttachments = false;
+  @State() hasMessageContent = false;
+
+  componentWillLoad() {
+    this.updateHasMessageContent();
+  }
+
+  private handleActionsSlotChange(event: Event) {
+    const slot = event.target as HTMLSlotElement;
+    this.hasActions =
+      slot.assignedElements({
+        flatten: true,
+      }).length > 0;
+  }
+
+  private handleAttachmentsSlotChange(event: Event) {
+    const slot = event.target as HTMLSlotElement;
+    this.hasAttachments =
+      slot.assignedElements({
+        flatten: true,
+      }).length > 0;
+  }
+
+  private handleMessageSlotChange(event: Event) {
+    this.updateHasMessageContent(event.target as HTMLSlotElement);
+  }
+
+  private hasAssignedMessageContent(slot?: HTMLSlotElement) {
+    if (slot) {
+      return slot.assignedNodes({ flatten: true }).some((node) => {
+        return node.nodeType === 1 || !!node.textContent?.trim();
+      });
+    }
+
+    return Array.from(this.hostElement.childNodes).some((node) => {
+      if (node.nodeType === 1) {
+        return (node as HTMLElement).slot === '';
+      }
+
+      return !!node.textContent?.trim();
+    });
+  }
+
+  private updateHasMessageContent(slot?: HTMLSlotElement) {
+    this.hasMessageContent = this.hasAssignedMessageContent(slot);
+  }
+
+  render() {
+    return (
+      <Host
+        class={{
+          'has-actions': this.hasActions,
+          'has-attachments': this.hasAttachments,
+        }}
+        tabIndex={this.hasActions ? 0 : undefined}
+      >
+        <div class="attachments">
+          <slot
+            name="attachments"
+            onSlotchange={(event) => this.handleAttachmentsSlotChange(event)}
+          ></slot>
+        </div>
+        <div class="message">
+          <ix-typography class="message-text" format="body" textColor="std">
+            {this.message}
+            <span
+              style={{
+                display: this.hasMessageContent ? undefined : 'none',
+              }}
+            >
+              <slot
+                onSlotchange={(event) => this.handleMessageSlotChange(event)}
+              ></slot>
+            </span>
+          </ix-typography>
+        </div>
+        <div
+          class="actions"
+          aria-hidden={!this.hasActions ? 'true' : undefined}
+        >
+          <slot
+            name="actions"
+            onSlotchange={(event) => this.handleActionsSlotChange(event)}
+          ></slot>
+        </div>
+      </Host>
+    );
+  }
+}
diff --git a/packages/core/src/components/chat-user-message/mixins/action.mixin.scss b/packages/core/src/components/chat-user-message/mixins/action.mixin.scss
new file mode 100644
index 00000000000..2bb3070319b
--- /dev/null
+++ b/packages/core/src/components/chat-user-message/mixins/action.mixin.scss
@@ -0,0 +1,8 @@
+@mixin animate-action() {
+  opacity: 0;
+  transition: opacity 0.2s ease-in-out;
+}
+
+@mixin show-action() {
+  opacity: 1;
+}
diff --git a/packages/core/src/components/chat-user-message/tests/chat-user-message.ct.ts b/packages/core/src/components/chat-user-message/tests/chat-user-message.ct.ts
new file mode 100644
index 00000000000..a8155bf9f31
--- /dev/null
+++ b/packages/core/src/components/chat-user-message/tests/chat-user-message.ct.ts
@@ -0,0 +1,147 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@playwright/test';
+import { regressionTest } from '@utils/test';
+
+regressionTest(
+  'ix-chat-user-message renders a user message from property',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-user-message message="Summarize the detailed discussion held with the customer"></ix-chat-user-message>'
+    );
+
+    const message = page.locator('ix-chat-user-message');
+
+    await expect(message.locator('.message-text')).toContainText(
+      'Summarize the detailed discussion held with the customer'
+    );
+    await expect(message.locator('.actions')).toHaveCount(1);
+    await expect(message.locator('.actions')).not.toBeVisible();
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message renders slotted message content',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-user-message><strong>Analyze alarms</strong></ix-chat-user-message>'
+    );
+
+    const message = page.locator('ix-chat-user-message');
+
+    await expect(message.locator('strong')).toContainText('Analyze alarms');
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message renders property and slotted message content together',
+  async ({ mount, page }) => {
+    await mount(
+      '<ix-chat-user-message message="Analyze alarms"><span> and show trends</span></ix-chat-user-message>'
+    );
+
+    const message = page.locator('ix-chat-user-message');
+
+    await expect(message.locator('.message-text')).toContainText(
+      'Analyze alarms'
+    );
+    await expect(page.locator('ix-chat-user-message > span')).toContainText(
+      'and show trends'
+    );
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message renders optional actions',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-user-message message="Analyze alarms" show-actions>
+        <button slot="actions" aria-label="Copy">Copy</button>
+        <button slot="actions" aria-label="Edit">Edit</button>
+      </ix-chat-user-message>
+    `);
+
+    const message = page.locator('ix-chat-user-message');
+
+    await expect(message.locator('.message-text')).toContainText(
+      'Analyze alarms'
+    );
+    await expect(message).toHaveClass(/has-actions/);
+    await expect(message.locator('.actions')).toBeVisible();
+    await expect(page.locator('button[slot="actions"]')).toHaveCount(2);
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message ignores whitespace from named slotted content',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-user-message message="Analyze alarms">
+        <button slot="actions" aria-label="Copy">Copy</button>
+        <button slot="actions" aria-label="Edit">Edit</button>
+      </ix-chat-user-message>
+    `);
+
+    const message = page.locator('ix-chat-user-message');
+
+    await expect(message.locator('.message-text')).toHaveText('Analyze alarms');
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message reveals actions on hover',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-user-message message="Analyze alarms">
+        <button slot="actions" aria-label="Copy">Copy</button>
+      </ix-chat-user-message>
+    `);
+
+    const message = page.locator('ix-chat-user-message');
+    const actions = message.locator('.actions');
+
+    await expect(actions).not.toBeVisible();
+
+    await message.hover();
+
+    await expect(actions).toBeVisible();
+  }
+);
+
+regressionTest(
+  'ix-chat-user-message renders slotted attachments',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat-user-message message="Analyze alarms">
+        <ix-chat-prompt-attachment slot="attachments" file-name="file_01.pdf" variant="sent" hide-remove-button preview-supported></ix-chat-prompt-attachment>
+      </ix-chat-user-message>
+    `);
+
+    await page.evaluate(() => {
+      const attachment = document.querySelector('ix-chat-prompt-attachment');
+      attachment?.addEventListener('attachmentClick', () => {
+        attachment.setAttribute('data-clicked', 'true');
+      });
+    });
+
+    const message = page.locator('ix-chat-user-message');
+    const attachment = page.locator(
+      'ix-chat-prompt-attachment[slot="attachments"]'
+    );
+
+    await expect(message).toHaveClass(/has-attachments/);
+    await expect(message.locator('.attachments')).toBeVisible();
+    await expect(attachment).toHaveCount(1);
+    await expect(attachment).toHaveAttribute('variant', 'sent');
+
+    await attachment.click();
+
+    await expect(attachment).toHaveAttribute('data-clicked', 'true');
+  }
+);
diff --git a/packages/core/src/components/chat/chat.scss b/packages/core/src/components/chat/chat.scss
new file mode 100644
index 00000000000..9f601dfd925
--- /dev/null
+++ b/packages/core/src/components/chat/chat.scss
@@ -0,0 +1,62 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+@use 'mixins/shadow-dom/component';
+
+:host {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  min-height: 0;
+  min-width: 27rem;
+  max-width: calc(45rem + var(--theme-space-5));
+  box-sizing: border-box;
+
+  @include component.ix-component;
+
+  .messages {
+    display: flex;
+    flex: 1 1 auto;
+    flex-direction: column;
+    align-items: center;
+    gap: var(--theme-space-5);
+    min-height: 0;
+    width: 100%;
+    padding: var(--theme-space-5);
+    box-sizing: border-box;
+    overflow-y: auto;
+  }
+
+  .messages ::slotted(*) {
+    width: 100%;
+    max-width: 45rem;
+    flex: 0 0 auto;
+  }
+
+  .prompt {
+    display: none;
+    flex: 0 0 auto;
+    width: 100%;
+    padding: var(--theme-space-5);
+    box-sizing: border-box;
+  }
+
+  .prompt ::slotted(*) {
+    width: 100%;
+    max-width: 45rem;
+  }
+}
+
+:host(.has-prompt) {
+  .prompt {
+    display: flex;
+    justify-content: center;
+  }
+}
diff --git a/packages/core/src/components/chat/chat.tsx b/packages/core/src/components/chat/chat.tsx
new file mode 100644
index 00000000000..5447ce4a4e5
--- /dev/null
+++ b/packages/core/src/components/chat/chat.tsx
@@ -0,0 +1,54 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { Component, Host, State, h } from '@stencil/core';
+
+/**
+ * @since 5.1.0
+ * @slot - Chat messages, for example ix-chat-user-message and ix-chat-ai-message
+ * @slot prompt - Chat input displayed below the chat messages
+ */
+@Component({
+  tag: 'ix-chat',
+  styleUrl: 'chat.scss',
+  shadow: true,
+})
+export class Chat {
+  @State() hasPrompt = false;
+
+  private hasAssignedContent(slot: HTMLSlotElement) {
+    return slot.assignedNodes({ flatten: true }).some((node) => {
+      return node.nodeType === 1 || !!node.textContent?.trim();
+    });
+  }
+
+  private handlePromptSlotChange(event: Event) {
+    this.hasPrompt = this.hasAssignedContent(event.target as HTMLSlotElement);
+  }
+
+  render() {
+    return (
+      <Host
+        class={{
+          'has-prompt': this.hasPrompt,
+        }}
+      >
+        <div class="messages" part="messages">
+          <slot></slot>
+        </div>
+        <div class="prompt" part="prompt">
+          <slot
+            name="prompt"
+            onSlotchange={(event) => this.handlePromptSlotChange(event)}
+          ></slot>
+        </div>
+      </Host>
+    );
+  }
+}
diff --git a/packages/core/src/components/chat/tests/chat.ct.ts b/packages/core/src/components/chat/tests/chat.ct.ts
new file mode 100644
index 00000000000..2ab4bac9654
--- /dev/null
+++ b/packages/core/src/components/chat/tests/chat.ct.ts
@@ -0,0 +1,76 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { expect } from '@playwright/test';
+import { regressionTest } from '@utils/test';
+
+regressionTest(
+  'ix-chat renders chat messages and chat input',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat style="height: 32rem">
+        <ix-chat-ai-message>
+          <p>Effective asset performance management improves uptime.</p>
+        </ix-chat-ai-message>
+        <ix-chat-user-message message="Summarize the detailed discussion held with the customer"></ix-chat-user-message>
+        <ix-chat-input slot="prompt" value="Ask a follow-up"></ix-chat-input>
+      </ix-chat>
+    `);
+
+    const chat = page.locator('ix-chat');
+
+    await expect(chat).toHaveClass(/has-prompt/);
+    await expect(chat.locator('.messages')).toBeVisible();
+    await expect(chat.locator('.prompt')).toBeVisible();
+    await expect(page.locator('ix-chat-ai-message')).toContainText(
+      'Effective asset performance management improves uptime.'
+    );
+    await expect(page.locator('ix-chat-user-message')).toContainText(
+      'Summarize the detailed discussion held with the customer'
+    );
+    await expect(page.locator('ix-chat-input[slot="prompt"]')).toHaveCount(1);
+  }
+);
+
+regressionTest(
+  'ix-chat hides prompt layout when no prompt is assigned',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat style="height: 32rem">
+        <ix-chat-ai-message>
+          <p>Analyze alarms.</p>
+        </ix-chat-ai-message>
+      </ix-chat>
+    `);
+
+    const chat = page.locator('ix-chat');
+
+    await expect(chat).not.toHaveClass(/has-prompt/);
+    await expect(chat.locator('.messages')).toBeVisible();
+    await expect(chat.locator('.prompt')).not.toBeVisible();
+  }
+);
+
+regressionTest(
+  'ix-chat provides a scrollable message area',
+  async ({ mount, page }) => {
+    await mount(`
+      <ix-chat style="height: 20rem">
+        <ix-chat-ai-message>
+          <p>Analyze alarms.</p>
+        </ix-chat-ai-message>
+        <ix-chat-input slot="prompt"></ix-chat-input>
+      </ix-chat>
+    `);
+
+    await expect(page.locator('ix-chat').locator('.messages')).toHaveCSS(
+      'overflow-y',
+      'auto'
+    );
+  }
+);
diff --git a/packages/core/src/components/chip/chip.scss b/packages/core/src/components/chip/chip.scss
index a30363e4bfc..dc1937db855 100644
--- a/packages/core/src/components/chip/chip.scss
+++ b/packages/core/src/components/chip/chip.scss
@@ -71,10 +71,6 @@ $outline-border-width: 0.0625rem;
   @include component.ix-component;
 }
 
-:host(.inactive) {
-  pointer-events: none;
-}
-
 .chip-wrap {
   display: inline-flex;
   width: inherit;
@@ -125,6 +121,13 @@ $outline-border-width: 0.0625rem;
 
     .slot-container {
       @include text-truncation.ellipsis;
+      flex: 0 1 auto;
+      min-width: 0;
+
+      slot::slotted(*) {
+        max-width: 100%;
+        min-width: 0;
+      }
     }
   }
 
@@ -133,16 +136,19 @@ $outline-border-width: 0.0625rem;
     text-align: center;
   }
 
+  &.inactive .chip-main {
+    pointer-events: none;
+  }
+
   &.outline .chip-main {
     padding-left: calc(#{$padding-inline} - #{$outline-border-width});
   }
 
-  &.outline:not(.closable) .chip-main,
-  &.outline.closable.inactive .chip-main {
+  &.outline:not(.closable) .chip-main {
     padding-right: calc(#{$padding-inline} - #{$outline-border-width});
   }
 
-  &.outline.closable:not(.inactive) .chip-main {
+  &.outline.closable .chip-main {
     padding-right: calc(
       #{$close-inset} + #{$close-size} + 0.375rem - #{$outline-border-width}
     );
@@ -152,12 +158,11 @@ $outline-border-width: 0.0625rem;
     padding-left: $padding-inline;
   }
 
-  &:not(.outline):not(.closable) .chip-main,
-  &:not(.outline).closable.inactive .chip-main {
+  &:not(.outline):not(.closable) .chip-main {
     padding-right: $padding-inline;
   }
 
-  &:not(.outline).closable:not(.inactive) .chip-main {
+  &:not(.outline).closable .chip-main {
     padding-right: calc(#{$close-inset} + #{$close-size} + 0.375rem);
   }
 
@@ -384,3 +389,9 @@ $outline-border-width: 0.0625rem;
     }
   }
 }
+
+:host(.attachment-chip) {
+  .chip-wrap {
+    border-radius: var(--theme-btn--border-radius);
+  }
+}
diff --git a/packages/core/src/components/chip/chip.tsx b/packages/core/src/components/chip/chip.tsx
index 2f8d3104ba4..d06aef11bfe 100644
--- a/packages/core/src/components/chip/chip.tsx
+++ b/packages/core/src/components/chip/chip.tsx
@@ -46,7 +46,7 @@ export class Chip
 
   /**
    * Determines if the chip is interactive. If true no user input (e.g. mouse states, keyboard navigation)
-   * will be possible and also the close button will not be present.
+   * will be possible on the main chip content.
    */
   @Prop() inactive = false;
 
@@ -187,7 +187,6 @@ export class Chip
     const { wrap: customWrapStyle, main: customMainStyle } =
       this.getCustomStyles(variant);
 
-    const showClose = !this.inactive && this.closable;
     const wrapClasses = {
       'chip-wrap': true,
       outline: this.outline,
@@ -214,7 +213,7 @@ export class Chip
     const hasTooltip =
       !!this.tooltipText || this.hostElement.hasAttribute('tooltip-text');
 
-    const needsGroupRole = hasAccessibleName && (showClose || hasTooltip);
+    const needsGroupRole = hasAccessibleName && (this.closable || hasTooltip);
 
     return (
       <Host
@@ -253,7 +252,7 @@ export class Chip
               </span>
             </div>
           </button>
-          {showClose && (
+          {this.closable && (
             <button
               type="button"
               class="chip-close"
diff --git a/packages/core/src/components/chip/test/chip.ct.ts b/packages/core/src/components/chip/test/chip.ct.ts
index 767a69b9b47..1587323a266 100644
--- a/packages/core/src/components/chip/test/chip.ct.ts
+++ b/packages/core/src/components/chip/test/chip.ct.ts
@@ -9,6 +9,10 @@
 import { expect } from '@playwright/test';
 import { regressionTest } from '@utils/test';
 
+declare global {
+  var __chipClosed: boolean | undefined;
+}
+
 regressionTest('accessibility', async ({ mount, makeAxeBuilder }) => {
   await mount(`
     <div style="display:flex;flex-direction:column;gap:0.5rem;align-items:flex-start;">
@@ -150,6 +154,105 @@ regressionTest('check inactive class', async ({ mount, page }) => {
   await expect(chip).toHaveClass('inactive hydrated');
 });
 
+regressionTest(
+  'keeps inactive closable chip text from overlapping the close button',
+  async ({ mount, page }) => {
+    await mount(
+      `<ix-chip inactive closable style="width: 8rem">Long inactive chip text</ix-chip>`
+    );
+
+    const chip = page.locator('ix-chip');
+    const slotContainer = chip.locator('.slot-container');
+    const closeButton = chip.locator('.chip-close');
+
+    await expect(closeButton).toBeVisible();
+
+    const slotBox = await slotContainer.boundingBox();
+    const closeBox = await closeButton.boundingBox();
+
+    expect(slotBox).not.toBeNull();
+    expect(closeBox).not.toBeNull();
+    expect(slotBox!.x + slotBox!.width).toBeLessThanOrEqual(closeBox!.x);
+  }
+);
+
+regressionTest(
+  'truncates overflowing chip text with an ellipsis',
+  async ({ mount, page }) => {
+    await mount(
+      `<ix-chip closable style="width: 8rem">Long overflowing chip text</ix-chip>`
+    );
+
+    const slotContainer = page.locator('ix-chip').locator('.slot-container');
+
+    const overflowState = await slotContainer.evaluate((element) => {
+      const style = getComputedStyle(element);
+
+      return {
+        clientWidth: element.clientWidth,
+        overflow: style.overflow,
+        scrollWidth: element.scrollWidth,
+        textOverflow: style.textOverflow,
+        whiteSpace: style.whiteSpace,
+      };
+    });
+
+    expect(overflowState.scrollWidth).toBeGreaterThan(
+      overflowState.clientWidth
+    );
+    expect(overflowState.overflow).toBe('hidden');
+    expect(overflowState.textOverflow).toBe('ellipsis');
+    expect(overflowState.whiteSpace).toBe('nowrap');
+  }
+);
+
+regressionTest(
+  'emits closeChip when the close button is clicked on an inactive chip',
+  async ({ mount, page }) => {
+    await mount(`<ix-chip inactive closable>Inactive chip</ix-chip>`);
+
+    await page.evaluate(() => {
+      globalThis.__chipClosed = false;
+      document.querySelector('ix-chip')?.addEventListener('closeChip', () => {
+        globalThis.__chipClosed = true;
+      });
+    });
+
+    await page.locator('ix-chip').locator('.chip-close').click();
+
+    await expect
+      .poll(() => page.evaluate(() => globalThis.__chipClosed))
+      .toBe(true);
+  }
+);
+
+regressionTest(
+  'does not apply main hover and active styles when inactive',
+  async ({ mount, page }) => {
+    await mount(`<ix-chip inactive closable>Inactive chip</ix-chip>`);
+
+    const chipMain = page.locator('ix-chip').locator('.chip-main');
+    const chipMainBox = await chipMain.boundingBox();
+
+    expect(chipMainBox).not.toBeNull();
+
+    const getBackgroundColor = () =>
+      chipMain.evaluate((element) => getComputedStyle(element).backgroundColor);
+
+    const defaultBackgroundColor = await getBackgroundColor();
+
+    await page.mouse.move(
+      chipMainBox!.x + chipMainBox!.width / 2,
+      chipMainBox!.y + chipMainBox!.height / 2
+    );
+    await expect.poll(getBackgroundColor).toBe(defaultBackgroundColor);
+
+    await page.mouse.down();
+    await expect.poll(getBackgroundColor).toBe(defaultBackgroundColor);
+    await page.mouse.up();
+  }
+);
+
 regressionTest.describe('tooltip', () => {
   regressionTest(
     'should not display when tooltip-text attribute is absent',
diff --git a/packages/core/src/components/dropdown-item/dropdown-item.scss b/packages/core/src/components/dropdown-item/dropdown-item.scss
index 6a13419bad7..1809938e7d1 100644
--- a/packages/core/src/components/dropdown-item/dropdown-item.scss
+++ b/packages/core/src/components/dropdown-item/dropdown-item.scss
@@ -78,7 +78,7 @@ $focusBorder: 0.0625rem;
     white-space: pre;
   }
 
-  .submenu-icon {
+  .dropdown-item-end {
     margin-left: auto;
   }
 }
diff --git a/packages/core/src/components/dropdown-item/dropdown-item.tsx b/packages/core/src/components/dropdown-item/dropdown-item.tsx
index 2a24de7b155..67ab5d23f44 100644
--- a/packages/core/src/components/dropdown-item/dropdown-item.tsx
+++ b/packages/core/src/components/dropdown-item/dropdown-item.tsx
@@ -192,12 +192,15 @@ export class DropdownItem
             {this.label}
             <slot></slot>
           </div>
-          {this.isSubMenu ? (
-            <ix-icon
-              name={iconChevronRightSmall}
-              class={'submenu-icon'}
-            ></ix-icon>
-          ) : null}
+          <div class="dropdown-item-end">
+            <slot name="end"></slot>
+            {this.isSubMenu ? (
+              <ix-icon
+                name={iconChevronRightSmall}
+                class={'submenu-icon'}
+              ></ix-icon>
+            ) : null}
+          </div>
         </div>
       </Host>
     );
diff --git a/packages/core/src/components/ix-playground/ix-playground.tsx b/packages/core/src/components/ix-playground/ix-playground.tsx
index 1e5d33a3ac4..3dbc539b1db 100644
--- a/packages/core/src/components/ix-playground/ix-playground.tsx
+++ b/packages/core/src/components/ix-playground/ix-playground.tsx
@@ -15,6 +15,10 @@ import { Component, Host, h } from '@stencil/core';
 })
 export class IxPlayground {
   render() {
-    return <Host></Host>;
+    return (
+      <Host>
+        <ix-chat-input></ix-chat-input>
+      </Host>
+    );
   }
 }
diff --git a/packages/core/src/public-api.ts b/packages/core/src/public-api.ts
index e3455705068..232ccf88c36 100644
--- a/packages/core/src/public-api.ts
+++ b/packages/core/src/public-api.ts
@@ -30,3 +30,4 @@ export {
   convertToRemString,
 } from './components/utils/rwd.util';
 export * from './components/utils/theme-switcher';
+export type { ChatPromptAttachmentStatus } from './components/chat-prompt-attachment/chat-prompt-attachment.types';
diff --git a/packages/core/stencil.config.ts b/packages/core/stencil.config.ts
index b19157b3d16..5902faeb2d8 100644
--- a/packages/core/stencil.config.ts
+++ b/packages/core/stencil.config.ts
@@ -85,6 +85,7 @@ export const config: Config = {
           elements: [
             'ix-select',
             'ix-input',
+            'ix-chat-input',
             'ix-textarea',
             'ix-number-input',
             'ix-date-input',
diff --git a/packages/html-test-app/src/preview-examples/chat-ai-message.html b/packages/html-test-app/src/preview-examples/chat-ai-message.html
new file mode 100644
index 00000000000..d816a427677
--- /dev/null
+++ b/packages/html-test-app/src/preview-examples/chat-ai-message.html
@@ -0,0 +1,90 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<!DOCTYPE html>
+<html lang="en" data-ix-theme="classic" data-ix-color-schema="system">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Chat AI message example</title>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconCopy,
+        iconGlobe,
+        iconRefresh,
+        iconThumbDown,
+        iconThumbUp,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconCopy,
+        iconGlobe,
+        iconRefresh,
+        iconThumbDown,
+        iconThumbUp,
+      });
+    </script>
+  </head>
+  <body>
+    <ix-chat class="chat-example__chat">
+      <ix-chat-ai-message>
+        <h3>Recommended maintenance actions</h3>
+        <p>
+          The compressor is operating within the expected range. Schedule the
+          next inspection during the Friday service window and keep monitoring
+          the vibration trend.
+        </p>
+        <ul>
+          <li>Review the acknowledged alarms from the last shift.</li>
+          <li>
+            Confirm that spare parts are available before the service window.
+          </li>
+          <li>Share the summary with the maintenance lead.</li>
+        </ul>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Copy response"
+          icon="copy"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Helpful response"
+          icon="thumb-up"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Not helpful response"
+          icon="thumb-down"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Regenerate response"
+          icon="refresh"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-chip slot="sources" icon="globe" outline variant="neutral">
+          Sources
+        </ix-chip>
+      </ix-chat-ai-message>
+    </ix-chat>
+
+    <script type="module" src="./init.js"></script>
+    <script type="module">
+      await window.ixInitPromise;
+    </script>
+  </body>
+</html>
diff --git a/packages/html-test-app/src/preview-examples/chat-input.html b/packages/html-test-app/src/preview-examples/chat-input.html
new file mode 100644
index 00000000000..68d7c86aee9
--- /dev/null
+++ b/packages/html-test-app/src/preview-examples/chat-input.html
@@ -0,0 +1,77 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<!DOCTYPE html>
+<html lang="en" data-ix-theme="classic" data-ix-color-schema="system">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Chat input example</title>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconImage,
+        iconMicrophone,
+        iconPdfDocument,
+        iconPlus,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconImage,
+        iconMicrophone,
+        iconPdfDocument,
+        iconPlus,
+      });
+    </script>
+  </head>
+  <body>
+    <ix-chat class="chat-example__chat">
+      <ix-chat-input
+        slot="prompt"
+        value="Check open alarms and suggest the next maintenance step."
+        placeholder="Ask about asset status..."
+        textarea-label="Service assistant prompt"
+        max-length="180"
+        character-limit="180"
+      >
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="shift_report.pdf"
+          icon="pdf-document"
+        ></ix-chat-prompt-attachment>
+        <ix-icon-button
+          slot="start"
+          aria-label="Attach file"
+          icon="plus"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="end"
+          aria-label="Add image"
+          icon="image"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="end"
+          aria-label="Record voice input"
+          icon="microphone"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+      </ix-chat-input>
+    </ix-chat>
+
+    <script type="module" src="./init.js"></script>
+    <script type="module">
+      await window.ixInitPromise;
+    </script>
+  </body>
+</html>
diff --git a/packages/html-test-app/src/preview-examples/chat-user-message.html b/packages/html-test-app/src/preview-examples/chat-user-message.html
new file mode 100644
index 00000000000..85e7a5e8eae
--- /dev/null
+++ b/packages/html-test-app/src/preview-examples/chat-user-message.html
@@ -0,0 +1,79 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<!DOCTYPE html>
+<html lang="en" data-ix-theme="classic" data-ix-color-schema="system">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Chat user message example</title>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconCopy,
+        iconMoreMenu,
+        iconPdfDocument,
+        iconPen,
+        iconTxtDocument,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconCopy,
+        iconMoreMenu,
+        iconPdfDocument,
+        iconPen,
+        iconTxtDocument,
+      });
+    </script>
+  </head>
+  <body>
+    <ix-chat class="chat-example__chat">
+      <ix-chat-user-message message="Summarize the attached shift report.">
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="shift_report.pdf"
+          icon="pdf-document"
+          hide-remove-button
+        ></ix-chat-prompt-attachment>
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="operator_notes.txt"
+          icon="txt-document"
+          hide-remove-button
+        ></ix-chat-prompt-attachment>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Copy message"
+          icon="copy"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Edit message"
+          icon="pen"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Show more actions"
+          icon="more-menu"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+      </ix-chat-user-message>
+    </ix-chat>
+
+    <script type="module" src="./init.js"></script>
+    <script type="module">
+      await window.ixInitPromise;
+    </script>
+  </body>
+</html>
diff --git a/packages/html-test-app/src/preview-examples/chat.html b/packages/html-test-app/src/preview-examples/chat.html
new file mode 100644
index 00000000000..7a760d401d9
--- /dev/null
+++ b/packages/html-test-app/src/preview-examples/chat.html
@@ -0,0 +1,165 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+-->
+
+<!DOCTYPE html>
+<html lang="en" data-ix-theme="classic" data-ix-color-schema="system">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Chat example</title>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconAttach,
+        iconCopy,
+        iconGlobe,
+        iconImage,
+        iconMicrophone,
+        iconMoreMenu,
+        iconPdfDocument,
+        iconPen,
+        iconRefresh,
+        iconThumbDown,
+        iconThumbUp,
+        iconTxtDocument,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconAttach,
+        iconCopy,
+        iconGlobe,
+        iconImage,
+        iconMicrophone,
+        iconMoreMenu,
+        iconPdfDocument,
+        iconPen,
+        iconRefresh,
+        iconThumbDown,
+        iconThumbUp,
+        iconTxtDocument,
+      });
+    </script>
+  </head>
+  <body>
+    <ix-chat class="chat-example__chat">
+      <ix-chat-user-message
+        message="Summarize the asset status and include the attached maintenance files."
+      >
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="equipment_status.pdf"
+          icon="pdf-document"
+          hide-remove-button
+        ></ix-chat-prompt-attachment>
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="maintenance_notes.txt"
+          icon="txt-document"
+          hide-remove-button
+        ></ix-chat-prompt-attachment>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Copy message"
+          icon="copy"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Edit message"
+          icon="pen"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Show more actions"
+          icon="more-menu"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+      </ix-chat-user-message>
+
+      <ix-chat-ai-message>
+        <h3>Asset performance summary</h3>
+        <p>
+          The compressor train is operating inside the expected range.
+          Vibration increased slightly after the last shift change, but all
+          values remain below the warning threshold.
+        </p>
+        <ul class="message-list">
+          <li>Temperature trend is stable over the last 24 hours.</li>
+          <li>Two alarms were acknowledged by the operator.</li>
+          <li>Next service window is scheduled for Friday.</li>
+        </ul>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Copy response"
+          icon="copy"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Helpful response"
+          icon="thumb-up"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Not helpful response"
+          icon="thumb-down"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-icon-button
+          slot="actions"
+          aria-label="Regenerate response"
+          icon="refresh"
+          size="24"
+          variant="subtle-tertiary"
+        ></ix-icon-button>
+        <ix-chip slot="sources" icon="globe" outline variant="neutral">
+          Sources
+        </ix-chip>
+      </ix-chat-ai-message>
+
+      <ix-chat-user-message
+        message="Compare the current report with additional customer feedback."
+      >
+        <ix-chat-prompt-attachment
+          slot="attachments"
+          file-name="customer_feedback.pdf"
+          icon="pdf-document"
+          hide-remove-button
+        ></ix-chat-prompt-attachment>
+      </ix-chat-user-message>
+
+      <ix-chat-ai-message>
+        <p>
+          Customer feedback confirms the same maintenance priorities. The next
+          step is to validate spare-part availability and confirm the planned
+          downtime window.
+        </p>
+      </ix-chat-ai-message>
+
+      <ix-chat-input
+        slot="prompt"
+        value="Create a concise follow-up plan for the service team."
+      >
+      </ix-chat-input>
+    </ix-chat>
+
+    <script type="module" src="./init.js"></script>
+    <script type="module">
+      await window.ixInitPromise;
+    </script>
+  </body>
+</html>
diff --git a/packages/react-test-app/src/main.tsx b/packages/react-test-app/src/main.tsx
index c6c471df250..e94854d5b6c 100644
--- a/packages/react-test-app/src/main.tsx
+++ b/packages/react-test-app/src/main.tsx
@@ -52,6 +52,10 @@ import Card from './preview-examples/card';
 import CardList from './preview-examples/card-list';
 import CategoryFilter from './preview-examples/category-filter';
 import CategoryFilterSuggestions from './preview-examples/category-filter-suggestions';
+import Chat from './preview-examples/chat';
+import ChatAiMessage from './preview-examples/chat-ai-message';
+import ChatInput from './preview-examples/chat-input';
+import ChatUserMessage from './preview-examples/chat-user-message';
 import Checkbox from './preview-examples/checkbox';
 import CheckboxIndeterminate from './preview-examples/checkbox-indeterminate';
 import Chip from './preview-examples/chip';
@@ -309,6 +313,10 @@ const routes: IxPreviewRoutes = {
   '/preview/card-list': CardList,
   '/preview/category-filter-suggestions': CategoryFilterSuggestions,
   '/preview/category-filter': CategoryFilter,
+  '/preview/chat': Chat,
+  '/preview/chat-ai-message': ChatAiMessage,
+  '/preview/chat-input': ChatInput,
+  '/preview/chat-user-message': ChatUserMessage,
   '/preview/checkbox-indeterminate': CheckboxIndeterminate,
   '/preview/checkbox': Checkbox,
   '/preview/custom-field': CustomField,
diff --git a/packages/react-test-app/src/preview-examples/chat-ai-message.tsx b/packages/react-test-app/src/preview-examples/chat-ai-message.tsx
new file mode 100644
index 00000000000..9cb58b5a258
--- /dev/null
+++ b/packages/react-test-app/src/preview-examples/chat-ai-message.tsx
@@ -0,0 +1,75 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  IxChat,
+  IxChatAiMessage,
+  IxChip,
+  IxIconButton,
+} from '@siemens/ix-react';
+import {
+  iconCopy,
+  iconGlobe,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+} from '@siemens/ix-icons/icons';
+
+export default () => {
+  return (
+    <IxChat className="chat-example__chat">
+      <IxChatAiMessage>
+        <h3>Recommended maintenance actions</h3>
+        <p>
+          The compressor is operating within the expected range. Schedule the
+          next inspection during the Friday service window and keep monitoring
+          the vibration trend.
+        </p>
+        <ul>
+          <li>Review the acknowledged alarms from the last shift.</li>
+          <li>
+            Confirm that spare parts are available before the service window.
+          </li>
+          <li>Share the summary with the maintenance lead.</li>
+        </ul>
+        <IxIconButton
+          slot="actions"
+          aria-label="Copy response"
+          icon={iconCopy}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Helpful response"
+          icon={iconThumbUp}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Not helpful response"
+          icon={iconThumbDown}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Regenerate response"
+          icon={iconRefresh}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxChip slot="sources" icon={iconGlobe} outline variant="neutral">
+          Sources
+        </IxChip>
+      </IxChatAiMessage>
+    </IxChat>
+  );
+};
diff --git a/packages/react-test-app/src/preview-examples/chat-input.tsx b/packages/react-test-app/src/preview-examples/chat-input.tsx
new file mode 100644
index 00000000000..b6e2d59a67d
--- /dev/null
+++ b/packages/react-test-app/src/preview-examples/chat-input.tsx
@@ -0,0 +1,63 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  IxChat,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxIconButton,
+} from '@siemens/ix-react';
+import {
+  iconImage,
+  iconMicrophone,
+  iconPdfDocument,
+  iconPlus,
+} from '@siemens/ix-icons/icons';
+
+export default () => {
+  return (
+    <IxChat className="chat-example__chat">
+      <IxChatInput
+        slot="prompt"
+        value="Check open alarms and suggest the next maintenance step."
+        placeholder="Ask about asset status..."
+        textareaLabel="Service assistant prompt"
+        maxLength={180}
+        characterLimit={180}
+      >
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="shift_report.pdf"
+          icon={iconPdfDocument}
+        ></IxChatPromptAttachment>
+        <IxIconButton
+          slot="start"
+          aria-label="Attach file"
+          icon={iconPlus}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="end"
+          aria-label="Add image"
+          icon={iconImage}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="end"
+          aria-label="Record voice input"
+          icon={iconMicrophone}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+      </IxChatInput>
+    </IxChat>
+  );
+};
diff --git a/packages/react-test-app/src/preview-examples/chat-user-message.tsx b/packages/react-test-app/src/preview-examples/chat-user-message.tsx
new file mode 100644
index 00000000000..8d36b788368
--- /dev/null
+++ b/packages/react-test-app/src/preview-examples/chat-user-message.tsx
@@ -0,0 +1,64 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  IxChat,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxIconButton,
+} from '@siemens/ix-react';
+import {
+  iconCopy,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+export default () => {
+  return (
+    <IxChat className="chat-example__chat">
+      <IxChatUserMessage message="Summarize the attached shift report.">
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="shift_report.pdf"
+          icon={iconPdfDocument}
+          hideRemoveButton
+        ></IxChatPromptAttachment>
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="operator_notes.txt"
+          icon={iconTxtDocument}
+          hideRemoveButton
+        ></IxChatPromptAttachment>
+        <IxIconButton
+          slot="actions"
+          aria-label="Copy message"
+          icon={iconCopy}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Edit message"
+          icon={iconPen}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Show more actions"
+          icon={iconMoreMenu}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+      </IxChatUserMessage>
+    </IxChat>
+  );
+};
diff --git a/packages/react-test-app/src/preview-examples/chat.tsx b/packages/react-test-app/src/preview-examples/chat.tsx
new file mode 100644
index 00000000000..0d1f6b1cda7
--- /dev/null
+++ b/packages/react-test-app/src/preview-examples/chat.tsx
@@ -0,0 +1,138 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {
+  IxChat,
+  IxChatAiMessage,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxChip,
+  IxIconButton,
+} from '@siemens/ix-react';
+import {
+  iconCopy,
+  iconGlobe,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+
+export default () => {
+  return (
+    <IxChat className="chat-example__chat">
+      <IxChatUserMessage message="Summarize the asset status and include the attached maintenance files.">
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="equipment_status.pdf"
+          icon={iconPdfDocument}
+          hideRemoveButton
+        ></IxChatPromptAttachment>
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="maintenance_notes.txt"
+          icon={iconTxtDocument}
+          hideRemoveButton
+        ></IxChatPromptAttachment>
+        <IxIconButton
+          slot="actions"
+          aria-label="Copy message"
+          icon={iconCopy}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Edit message"
+          icon={iconPen}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Show more actions"
+          icon={iconMoreMenu}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+      </IxChatUserMessage>
+
+      <IxChatAiMessage>
+        <h3>Asset performance summary</h3>
+        <p>
+          The compressor train is operating inside the expected range. Vibration
+          increased slightly after the last shift change, but all values remain
+          below the warning threshold.
+        </p>
+        <ul className="message-list">
+          <li>Temperature trend is stable over the last 24 hours.</li>
+          <li>Two alarms were acknowledged by the operator.</li>
+          <li>Next service window is scheduled for Friday.</li>
+        </ul>
+        <IxIconButton
+          slot="actions"
+          aria-label="Copy response"
+          icon={iconCopy}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Helpful response"
+          icon={iconThumbUp}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Not helpful response"
+          icon={iconThumbDown}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxIconButton
+          slot="actions"
+          aria-label="Regenerate response"
+          icon={iconRefresh}
+          size="24"
+          variant="subtle-tertiary"
+        ></IxIconButton>
+        <IxChip slot="sources" icon={iconGlobe} outline variant="neutral">
+          Sources
+        </IxChip>
+      </IxChatAiMessage>
+
+      <IxChatUserMessage message="Compare the current report with additional customer feedback.">
+        <IxChatPromptAttachment
+          slot="attachments"
+          fileName="customer_feedback.pdf"
+          icon={iconPdfDocument}
+          hideRemoveButton
+        ></IxChatPromptAttachment>
+      </IxChatUserMessage>
+
+      <IxChatAiMessage>
+        <p>
+          Customer feedback confirms the same maintenance priorities. The next
+          step is to validate spare-part availability and confirm the planned
+          downtime window.
+        </p>
+      </IxChatAiMessage>
+
+      <IxChatInput
+        slot="prompt"
+        value="Create a concise follow-up plan for the service team."
+      ></IxChatInput>
+    </IxChat>
+  );
+};
diff --git a/packages/react/src/components/components.server.ts b/packages/react/src/components/components.server.ts
index 3e097734e8c..6927f0ead64 100644
--- a/packages/react/src/components/components.server.ts
+++ b/packages/react/src/components/components.server.ts
@@ -12,7 +12,7 @@ import { createComponent, type HydrateModule, type SerializeShadowRootOptions }
 
 // @ts-ignore - ignore potential type issues as the project is importing itself
 import * as clientComponents from "@siemens/ix";
-import { type BorderlessChangedEvent, type BreadcrumbClick, type CustomCloseEvent, type CustomLabelChangeEvent, type DateChangeEvent, type DateInputValidityState, type DateRangeChangeEvent, type DateTimeDateChangeEvent, type DateTimeInputValidityState, type DateTimeSelectEvent, type ExpandedChangedEvent, type FilterState, type InputState, type IxApplicationHeaderCustomEvent, type IxBlindCustomEvent, type IxBreadcrumbCustomEvent, type IxCardListCustomEvent, type IxCategoryFilterCustomEvent, type IxCheckboxCustomEvent, type IxChipCustomEvent, type IxContentHeaderCustomEvent, type IxDateDropdownCustomEvent, type IxDateInputCustomEvent, type IxDatePickerCustomEvent, type IxDatetimeInputCustomEvent, type IxDatetimePickerCustomEvent, type IxDropdownButtonCustomEvent, type IxDropdownCustomEvent, type IxEmptyStateCustomEvent, type IxEventListItemCustomEvent, type IxExpandingSearchCustomEvent, type IxFilterChipCustomEvent, type IxFlipTileCustomEvent, type IxGroupCustomEvent, type IxGroupItemCustomEvent, type IxIconToggleButtonCustomEvent, type IxInputCustomEvent, type IxMenuAboutCustomEvent, type IxMenuAboutItemCustomEvent, type IxMenuAboutNewsCustomEvent, type IxMenuAvatarCustomEvent, type IxMenuAvatarItemCustomEvent, type IxMenuCustomEvent, type IxMenuSettingsCustomEvent, type IxMessageBarCustomEvent, type IxModalCustomEvent, type IxModalHeaderCustomEvent, type IxNumberInputCustomEvent, type IxPaginationCustomEvent, type IxPaneCustomEvent, type IxRadioCustomEvent, type IxRadioGroupCustomEvent, type IxSelectCustomEvent, type IxSelectItemCustomEvent, type IxSliderCustomEvent, type IxSplitButtonCustomEvent, type IxTabItemCustomEvent, type IxTabsCustomEvent, type IxTextareaCustomEvent, type IxTimeInputCustomEvent, type IxTimePickerCustomEvent, type IxToastCustomEvent, type IxToggleButtonCustomEvent, type IxToggleCustomEvent, type IxUploadCustomEvent, type IxWorkflowStepsCustomEvent, type TabClickDetail, type TimeInputValidityState, type VariantChangedEvent } from "@siemens/ix";
+import { type BorderlessChangedEvent, type BreadcrumbClick, type CustomCloseEvent, type CustomLabelChangeEvent, type DateChangeEvent, type DateInputValidityState, type DateRangeChangeEvent, type DateTimeDateChangeEvent, type DateTimeInputValidityState, type DateTimeSelectEvent, type ExpandedChangedEvent, type FilterState, type InputState, type IxApplicationHeaderCustomEvent, type IxBlindCustomEvent, type IxBreadcrumbCustomEvent, type IxCardListCustomEvent, type IxCategoryFilterCustomEvent, type IxChatInputCustomEvent, type IxChatPromptAttachmentCustomEvent, type IxCheckboxCustomEvent, type IxChipCustomEvent, type IxContentHeaderCustomEvent, type IxDateDropdownCustomEvent, type IxDateInputCustomEvent, type IxDatePickerCustomEvent, type IxDatetimeInputCustomEvent, type IxDatetimePickerCustomEvent, type IxDropdownButtonCustomEvent, type IxDropdownCustomEvent, type IxEmptyStateCustomEvent, type IxEventListItemCustomEvent, type IxExpandingSearchCustomEvent, type IxFilterChipCustomEvent, type IxFlipTileCustomEvent, type IxGroupCustomEvent, type IxGroupItemCustomEvent, type IxIconToggleButtonCustomEvent, type IxInputCustomEvent, type IxMenuAboutCustomEvent, type IxMenuAboutItemCustomEvent, type IxMenuAboutNewsCustomEvent, type IxMenuAvatarCustomEvent, type IxMenuAvatarItemCustomEvent, type IxMenuCustomEvent, type IxMenuSettingsCustomEvent, type IxMessageBarCustomEvent, type IxModalCustomEvent, type IxModalHeaderCustomEvent, type IxNumberInputCustomEvent, type IxPaginationCustomEvent, type IxPaneCustomEvent, type IxRadioCustomEvent, type IxRadioGroupCustomEvent, type IxSelectCustomEvent, type IxSelectItemCustomEvent, type IxSliderCustomEvent, type IxSplitButtonCustomEvent, type IxTabItemCustomEvent, type IxTabsCustomEvent, type IxTextareaCustomEvent, type IxTimeInputCustomEvent, type IxTimePickerCustomEvent, type IxToastCustomEvent, type IxToggleButtonCustomEvent, type IxToggleCustomEvent, type IxUploadCustomEvent, type IxWorkflowStepsCustomEvent, type TabClickDetail, type TimeInputValidityState, type VariantChangedEvent } from "@siemens/ix";
 import type { Components } from "@siemens/ix/components";
 import { IxActionCard as IxActionCardElement } from "@siemens/ix/components/ix-action-card.js";
 import { IxApplicationHeader as IxApplicationHeaderElement } from "@siemens/ix/components/ix-application-header.js";
@@ -28,6 +28,11 @@ import { IxCardList as IxCardListElement } from "@siemens/ix/components/ix-card-
 import { IxCardTitle as IxCardTitleElement } from "@siemens/ix/components/ix-card-title.js";
 import { IxCard as IxCardElement } from "@siemens/ix/components/ix-card.js";
 import { IxCategoryFilter as IxCategoryFilterElement } from "@siemens/ix/components/ix-category-filter.js";
+import { IxChatAiMessage as IxChatAiMessageElement } from "@siemens/ix/components/ix-chat-ai-message.js";
+import { IxChatInput as IxChatInputElement } from "@siemens/ix/components/ix-chat-input.js";
+import { IxChatPromptAttachment as IxChatPromptAttachmentElement } from "@siemens/ix/components/ix-chat-prompt-attachment.js";
+import { IxChatUserMessage as IxChatUserMessageElement } from "@siemens/ix/components/ix-chat-user-message.js";
+import { IxChat as IxChatElement } from "@siemens/ix/components/ix-chat.js";
 import { IxCheckboxGroup as IxCheckboxGroupElement } from "@siemens/ix/components/ix-checkbox-group.js";
 import { IxCheckbox as IxCheckboxElement } from "@siemens/ix/components/ix-checkbox.js";
 import { IxChip as IxChipElement } from "@siemens/ix/components/ix-chip.js";
@@ -374,6 +379,88 @@ export const IxCategoryFilter: StencilReactComponent<IxCategoryFilterElement, Ix
     serializeShadowRoot
 });
 
+export type IxChatEvents = NonNullable<unknown>;
+
+export const IxChat: StencilReactComponent<IxChatElement, IxChatEvents, Components.IxChat> = /*@__PURE__*/ createComponent<IxChatElement, IxChatEvents, Components.IxChat>({
+    tagName: 'ix-chat',
+    properties: {},
+    hydrateModule: typeof window === 'undefined' ? (import('@siemens/ix/hydrate') as Promise<HydrateModule>) : undefined,
+    clientModule: clientComponents.IxChat as StencilReactComponent<IxChatElement, IxChatEvents, Components.IxChat>,
+    serializeShadowRoot
+});
+
+export type IxChatAiMessageEvents = NonNullable<unknown>;
+
+export const IxChatAiMessage: StencilReactComponent<IxChatAiMessageElement, IxChatAiMessageEvents, Components.IxChatAiMessage> = /*@__PURE__*/ createComponent<IxChatAiMessageElement, IxChatAiMessageEvents, Components.IxChatAiMessage>({
+    tagName: 'ix-chat-ai-message',
+    properties: {},
+    hydrateModule: typeof window === 'undefined' ? (import('@siemens/ix/hydrate') as Promise<HydrateModule>) : undefined,
+    clientModule: clientComponents.IxChatAiMessage as StencilReactComponent<IxChatAiMessageElement, IxChatAiMessageEvents, Components.IxChatAiMessage>,
+    serializeShadowRoot
+});
+
+export type IxChatInputEvents = {
+    onValueChange: EventName<IxChatInputCustomEvent<string>>,
+    onIxBlur: EventName<IxChatInputCustomEvent<void>>,
+    onIxChange: EventName<IxChatInputCustomEvent<string>>,
+    onPromptSubmit: EventName<IxChatInputCustomEvent<string>>
+};
+
+export const IxChatInput: StencilReactComponent<IxChatInputElement, IxChatInputEvents, Components.IxChatInput> = /*@__PURE__*/ createComponent<IxChatInputElement, IxChatInputEvents, Components.IxChatInput>({
+    tagName: 'ix-chat-input',
+    properties: {
+        state: 'state',
+        name: 'name',
+        placeholder: 'placeholder',
+        value: 'value',
+        disabled: 'disabled',
+        readonly: 'readonly',
+        textareaLabel: 'textarea-label',
+        maxLength: 'max-length',
+        characterLimit: 'character-limit',
+        i18nCharacterLimitReached: 'i18n-character-limit-reached',
+        i18nCharacterLimitWarning: 'i18n-character-limit-warning',
+        characterLimitWarningThreshold: 'character-limit-warning-threshold',
+        minRows: 'min-rows',
+        maxRows: 'max-rows',
+        insertLineBreakOnEnter: 'insert-line-break-on-enter',
+        disclaimer: 'disclaimer'
+    },
+    hydrateModule: typeof window === 'undefined' ? (import('@siemens/ix/hydrate') as Promise<HydrateModule>) : undefined,
+    clientModule: clientComponents.IxChatInput as StencilReactComponent<IxChatInputElement, IxChatInputEvents, Components.IxChatInput>,
+    serializeShadowRoot
+});
+
+export type IxChatPromptAttachmentEvents = {
+    onAttachmentClick: EventName<IxChatPromptAttachmentCustomEvent<void>>,
+    onRemoveClick: EventName<IxChatPromptAttachmentCustomEvent<void>>
+};
+
+export const IxChatPromptAttachment: StencilReactComponent<IxChatPromptAttachmentElement, IxChatPromptAttachmentEvents, Components.IxChatPromptAttachment> = /*@__PURE__*/ createComponent<IxChatPromptAttachmentElement, IxChatPromptAttachmentEvents, Components.IxChatPromptAttachment>({
+    tagName: 'ix-chat-prompt-attachment',
+    properties: {
+        fileName: 'file-name',
+        status: 'status',
+        icon: 'icon',
+        hideRemoveButton: 'hide-remove-button',
+        previewSupported: 'preview-supported',
+        removeAriaLabel: 'remove-aria-label'
+    },
+    hydrateModule: typeof window === 'undefined' ? (import('@siemens/ix/hydrate') as Promise<HydrateModule>) : undefined,
+    clientModule: clientComponents.IxChatPromptAttachment as StencilReactComponent<IxChatPromptAttachmentElement, IxChatPromptAttachmentEvents, Components.IxChatPromptAttachment>,
+    serializeShadowRoot
+});
+
+export type IxChatUserMessageEvents = NonNullable<unknown>;
+
+export const IxChatUserMessage: StencilReactComponent<IxChatUserMessageElement, IxChatUserMessageEvents, Components.IxChatUserMessage> = /*@__PURE__*/ createComponent<IxChatUserMessageElement, IxChatUserMessageEvents, Components.IxChatUserMessage>({
+    tagName: 'ix-chat-user-message',
+    properties: { message: 'message' },
+    hydrateModule: typeof window === 'undefined' ? (import('@siemens/ix/hydrate') as Promise<HydrateModule>) : undefined,
+    clientModule: clientComponents.IxChatUserMessage as StencilReactComponent<IxChatUserMessageElement, IxChatUserMessageEvents, Components.IxChatUserMessage>,
+    serializeShadowRoot
+});
+
 export type IxCheckboxEvents = {
     onCheckedChange: EventName<IxCheckboxCustomEvent<boolean>>,
     onValueChange: EventName<IxCheckboxCustomEvent<string>>,
diff --git a/packages/react/src/components/components.ts b/packages/react/src/components/components.ts
index 3fce49d08a6..da1864b9543 100644
--- a/packages/react/src/components/components.ts
+++ b/packages/react/src/components/components.ts
@@ -11,7 +11,7 @@ import type { EventName, StencilReactComponent } from '@stencil/react-output-tar
 import { createComponent } from '@stencil/react-output-target/runtime';
 import React from 'react';
 
-import { type BorderlessChangedEvent, type BreadcrumbClick, type CustomCloseEvent, type CustomLabelChangeEvent, type DateChangeEvent, type DateInputValidityState, type DateRangeChangeEvent, type DateTimeDateChangeEvent, type DateTimeInputValidityState, type DateTimeSelectEvent, type ExpandedChangedEvent, type FilterState, type InputState, type IxApplicationHeaderCustomEvent, type IxBlindCustomEvent, type IxBreadcrumbCustomEvent, type IxCardListCustomEvent, type IxCategoryFilterCustomEvent, type IxCheckboxCustomEvent, type IxChipCustomEvent, type IxContentHeaderCustomEvent, type IxDateDropdownCustomEvent, type IxDateInputCustomEvent, type IxDatePickerCustomEvent, type IxDatetimeInputCustomEvent, type IxDatetimePickerCustomEvent, type IxDropdownButtonCustomEvent, type IxDropdownCustomEvent, type IxEmptyStateCustomEvent, type IxEventListItemCustomEvent, type IxExpandingSearchCustomEvent, type IxFilterChipCustomEvent, type IxFlipTileCustomEvent, type IxGroupCustomEvent, type IxGroupItemCustomEvent, type IxIconToggleButtonCustomEvent, type IxInputCustomEvent, type IxMenuAboutCustomEvent, type IxMenuAboutItemCustomEvent, type IxMenuAboutNewsCustomEvent, type IxMenuAvatarCustomEvent, type IxMenuAvatarItemCustomEvent, type IxMenuCustomEvent, type IxMenuSettingsCustomEvent, type IxMessageBarCustomEvent, type IxModalCustomEvent, type IxModalHeaderCustomEvent, type IxNumberInputCustomEvent, type IxPaginationCustomEvent, type IxPaneCustomEvent, type IxRadioCustomEvent, type IxRadioGroupCustomEvent, type IxSelectCustomEvent, type IxSelectItemCustomEvent, type IxSliderCustomEvent, type IxSplitButtonCustomEvent, type IxTabItemCustomEvent, type IxTabsCustomEvent, type IxTextareaCustomEvent, type IxTimeInputCustomEvent, type IxTimePickerCustomEvent, type IxToastCustomEvent, type IxToggleButtonCustomEvent, type IxToggleCustomEvent, type IxUploadCustomEvent, type IxWorkflowStepsCustomEvent, type TabClickDetail, type TimeInputValidityState, type VariantChangedEvent } from "@siemens/ix";
+import { type BorderlessChangedEvent, type BreadcrumbClick, type CustomCloseEvent, type CustomLabelChangeEvent, type DateChangeEvent, type DateInputValidityState, type DateRangeChangeEvent, type DateTimeDateChangeEvent, type DateTimeInputValidityState, type DateTimeSelectEvent, type ExpandedChangedEvent, type FilterState, type InputState, type IxApplicationHeaderCustomEvent, type IxBlindCustomEvent, type IxBreadcrumbCustomEvent, type IxCardListCustomEvent, type IxCategoryFilterCustomEvent, type IxChatInputCustomEvent, type IxChatPromptAttachmentCustomEvent, type IxCheckboxCustomEvent, type IxChipCustomEvent, type IxContentHeaderCustomEvent, type IxDateDropdownCustomEvent, type IxDateInputCustomEvent, type IxDatePickerCustomEvent, type IxDatetimeInputCustomEvent, type IxDatetimePickerCustomEvent, type IxDropdownButtonCustomEvent, type IxDropdownCustomEvent, type IxEmptyStateCustomEvent, type IxEventListItemCustomEvent, type IxExpandingSearchCustomEvent, type IxFilterChipCustomEvent, type IxFlipTileCustomEvent, type IxGroupCustomEvent, type IxGroupItemCustomEvent, type IxIconToggleButtonCustomEvent, type IxInputCustomEvent, type IxMenuAboutCustomEvent, type IxMenuAboutItemCustomEvent, type IxMenuAboutNewsCustomEvent, type IxMenuAvatarCustomEvent, type IxMenuAvatarItemCustomEvent, type IxMenuCustomEvent, type IxMenuSettingsCustomEvent, type IxMessageBarCustomEvent, type IxModalCustomEvent, type IxModalHeaderCustomEvent, type IxNumberInputCustomEvent, type IxPaginationCustomEvent, type IxPaneCustomEvent, type IxRadioCustomEvent, type IxRadioGroupCustomEvent, type IxSelectCustomEvent, type IxSelectItemCustomEvent, type IxSliderCustomEvent, type IxSplitButtonCustomEvent, type IxTabItemCustomEvent, type IxTabsCustomEvent, type IxTextareaCustomEvent, type IxTimeInputCustomEvent, type IxTimePickerCustomEvent, type IxToastCustomEvent, type IxToggleButtonCustomEvent, type IxToggleCustomEvent, type IxUploadCustomEvent, type IxWorkflowStepsCustomEvent, type TabClickDetail, type TimeInputValidityState, type VariantChangedEvent } from "@siemens/ix";
 import type { Components } from "@siemens/ix/components";
 import { IxActionCard as IxActionCardElement, defineCustomElement as defineIxActionCard } from "@siemens/ix/components/ix-action-card.js";
 import { IxApplicationHeader as IxApplicationHeaderElement, defineCustomElement as defineIxApplicationHeader } from "@siemens/ix/components/ix-application-header.js";
@@ -27,6 +27,11 @@ import { IxCardList as IxCardListElement, defineCustomElement as defineIxCardLis
 import { IxCardTitle as IxCardTitleElement, defineCustomElement as defineIxCardTitle } from "@siemens/ix/components/ix-card-title.js";
 import { IxCard as IxCardElement, defineCustomElement as defineIxCard } from "@siemens/ix/components/ix-card.js";
 import { IxCategoryFilter as IxCategoryFilterElement, defineCustomElement as defineIxCategoryFilter } from "@siemens/ix/components/ix-category-filter.js";
+import { IxChatAiMessage as IxChatAiMessageElement, defineCustomElement as defineIxChatAiMessage } from "@siemens/ix/components/ix-chat-ai-message.js";
+import { IxChatInput as IxChatInputElement, defineCustomElement as defineIxChatInput } from "@siemens/ix/components/ix-chat-input.js";
+import { IxChatPromptAttachment as IxChatPromptAttachmentElement, defineCustomElement as defineIxChatPromptAttachment } from "@siemens/ix/components/ix-chat-prompt-attachment.js";
+import { IxChatUserMessage as IxChatUserMessageElement, defineCustomElement as defineIxChatUserMessage } from "@siemens/ix/components/ix-chat-user-message.js";
+import { IxChat as IxChatElement, defineCustomElement as defineIxChat } from "@siemens/ix/components/ix-chat.js";
 import { IxCheckboxGroup as IxCheckboxGroupElement, defineCustomElement as defineIxCheckboxGroup } from "@siemens/ix/components/ix-checkbox-group.js";
 import { IxCheckbox as IxCheckboxElement, defineCustomElement as defineIxCheckbox } from "@siemens/ix/components/ix-checkbox.js";
 import { IxChip as IxChipElement, defineCustomElement as defineIxChip } from "@siemens/ix/components/ix-chip.js";
@@ -297,6 +302,77 @@ export const IxCategoryFilter: StencilReactComponent<IxCategoryFilterElement, Ix
     defineCustomElement: defineIxCategoryFilter
 });
 
+export type IxChatEvents = NonNullable<unknown>;
+
+export const IxChat: StencilReactComponent<IxChatElement, IxChatEvents, Components.IxChat> = /*@__PURE__*/ createComponent<IxChatElement, IxChatEvents, Components.IxChat>({
+    tagName: 'ix-chat',
+    elementClass: IxChatElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as IxChatEvents,
+    defineCustomElement: defineIxChat
+});
+
+export type IxChatAiMessageEvents = NonNullable<unknown>;
+
+export const IxChatAiMessage: StencilReactComponent<IxChatAiMessageElement, IxChatAiMessageEvents, Components.IxChatAiMessage> = /*@__PURE__*/ createComponent<IxChatAiMessageElement, IxChatAiMessageEvents, Components.IxChatAiMessage>({
+    tagName: 'ix-chat-ai-message',
+    elementClass: IxChatAiMessageElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as IxChatAiMessageEvents,
+    defineCustomElement: defineIxChatAiMessage
+});
+
+export type IxChatInputEvents = {
+    onValueChange: EventName<IxChatInputCustomEvent<string>>,
+    onIxBlur: EventName<IxChatInputCustomEvent<void>>,
+    onIxChange: EventName<IxChatInputCustomEvent<string>>,
+    onPromptSubmit: EventName<IxChatInputCustomEvent<string>>
+};
+
+export const IxChatInput: StencilReactComponent<IxChatInputElement, IxChatInputEvents, Components.IxChatInput> = /*@__PURE__*/ createComponent<IxChatInputElement, IxChatInputEvents, Components.IxChatInput>({
+    tagName: 'ix-chat-input',
+    elementClass: IxChatInputElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onValueChange: 'valueChange',
+        onIxBlur: 'ixBlur',
+        onIxChange: 'ixChange',
+        onPromptSubmit: 'promptSubmit'
+    } as IxChatInputEvents,
+    defineCustomElement: defineIxChatInput
+});
+
+export type IxChatPromptAttachmentEvents = {
+    onAttachmentClick: EventName<IxChatPromptAttachmentCustomEvent<void>>,
+    onRemoveClick: EventName<IxChatPromptAttachmentCustomEvent<void>>
+};
+
+export const IxChatPromptAttachment: StencilReactComponent<IxChatPromptAttachmentElement, IxChatPromptAttachmentEvents, Components.IxChatPromptAttachment> = /*@__PURE__*/ createComponent<IxChatPromptAttachmentElement, IxChatPromptAttachmentEvents, Components.IxChatPromptAttachment>({
+    tagName: 'ix-chat-prompt-attachment',
+    elementClass: IxChatPromptAttachmentElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {
+        onAttachmentClick: 'attachmentClick',
+        onRemoveClick: 'removeClick'
+    } as IxChatPromptAttachmentEvents,
+    defineCustomElement: defineIxChatPromptAttachment
+});
+
+export type IxChatUserMessageEvents = NonNullable<unknown>;
+
+export const IxChatUserMessage: StencilReactComponent<IxChatUserMessageElement, IxChatUserMessageEvents, Components.IxChatUserMessage> = /*@__PURE__*/ createComponent<IxChatUserMessageElement, IxChatUserMessageEvents, Components.IxChatUserMessage>({
+    tagName: 'ix-chat-user-message',
+    elementClass: IxChatUserMessageElement,
+    // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
+    react: React,
+    events: {} as IxChatUserMessageEvents,
+    defineCustomElement: defineIxChatUserMessage
+});
+
 export type IxCheckboxEvents = {
     onCheckedChange: EventName<IxCheckboxCustomEvent<boolean>>,
     onValueChange: EventName<IxCheckboxCustomEvent<string>>,
diff --git a/packages/storybook-docs/.storybook/define-custom-elements.ts b/packages/storybook-docs/.storybook/define-custom-elements.ts
index 2c6127ec5fc..886b692a307 100644
--- a/packages/storybook-docs/.storybook/define-custom-elements.ts
+++ b/packages/storybook-docs/.storybook/define-custom-elements.ts
@@ -14,6 +14,11 @@ import { defineCustomElement as ixCardContent } from '@siemens/ix/components/ix-
 import { defineCustomElement as ixCardList } from '@siemens/ix/components/ix-card-list.js';
 import { defineCustomElement as ixCardTitle } from '@siemens/ix/components/ix-card-title.js';
 import { defineCustomElement as ixCategoryFilter } from '@siemens/ix/components/ix-category-filter.js';
+import { defineCustomElement as ixChat } from '@siemens/ix/components/ix-chat.js';
+import { defineCustomElement as ixChatAiMessage } from '@siemens/ix/components/ix-chat-ai-message.js';
+import { defineCustomElement as ixChatInput } from '@siemens/ix/components/ix-chat-input.js';
+import { defineCustomElement as ixChatPromptAttachment } from '@siemens/ix/components/ix-chat-prompt-attachment.js';
+import { defineCustomElement as ixChatUserMessage } from '@siemens/ix/components/ix-chat-user-message.js';
 import { defineCustomElement as ixCheckbox } from '@siemens/ix/components/ix-checkbox.js';
 import { defineCustomElement as ixCheckboxGroup } from '@siemens/ix/components/ix-checkbox-group.js';
 import { defineCustomElement as ixChip } from '@siemens/ix/components/ix-chip.js';
@@ -115,6 +120,11 @@ ixCardContent();
 ixCardList();
 ixCardTitle();
 ixCategoryFilter();
+ixChat();
+ixChatAiMessage();
+ixChatInput();
+ixChatPromptAttachment();
+ixChatUserMessage();
 ixCheckbox();
 ixCheckboxGroup();
 ixChip();
diff --git a/packages/storybook-docs/package.json b/packages/storybook-docs/package.json
index 4306cf1aa01..a9da2157fd4 100644
--- a/packages/storybook-docs/package.json
+++ b/packages/storybook-docs/package.json
@@ -18,7 +18,7 @@
   "devDependencies": {
     "@siemens/ix": "workspace:*",
     "@siemens/ix-icons": "catalog:",
-    "@stencil/core": "~4.17.0",
+    "@stencil/core": "^4.43.4",
     "@storybook/addon-a11y": "^10.1.11",
     "@storybook/addon-designs": "^11.1.1",
     "@storybook/addon-docs": "^10.1.11",
diff --git a/packages/storybook-docs/src/stories/chat-ai-message.stories.tsx b/packages/storybook-docs/src/stories/chat-ai-message.stories.tsx
new file mode 100644
index 00000000000..3faca64865e
--- /dev/null
+++ b/packages/storybook-docs/src/stories/chat-ai-message.stories.tsx
@@ -0,0 +1,109 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import {
+  iconCopy,
+  iconGlobe,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+} from '@siemens/ix-icons/icons';
+import type { Components } from '@siemens/ix/components';
+import { h, type VNode } from '@stencil/core';
+import type { ArgTypes, Meta, StoryObj } from '@storybook/web-components-vite';
+import { stencil } from '@utils/stencil-render';
+import { makeArgTypes } from './utils/generic-render';
+
+type Element = Components.IxChatAiMessage;
+
+function createMessageContent() {
+  return [
+    <h3>Text block example</h3>,
+    <p>
+      Effective asset performance management improves uptime, reduces
+      maintenance costs, and ensures long-term equipment health.
+    </p>,
+    <p>Summary</p>,
+  ];
+}
+
+function createAction(label: string, icon: string) {
+  return (
+    <ix-icon-button
+      aria-label={label}
+      icon={icon}
+      size="16"
+      slot="actions"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  );
+}
+
+function createSources() {
+  return (
+    <ix-chip
+      aria-label="Show sources"
+      icon={iconGlobe}
+      outline
+      slot="sources"
+      variant="neutral"
+    >
+      Sources
+    </ix-chip>
+  );
+}
+
+function renderChatAiMessage(args: Partial<Element>, children: VNode[] = []) {
+  return (
+    <ix-chat-ai-message {...args}>
+      {createMessageContent()}
+      {children}
+    </ix-chat-ai-message>
+  );
+}
+
+const meta = {
+  title: 'Example/Chat AI Message',
+  tags: [],
+  render: stencil((args) => renderChatAiMessage(args)),
+  argTypes: makeArgTypes<Partial<ArgTypes<Element>>>('ix-chat-ai-message'),
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=12471-120647&m=dev',
+    },
+  },
+} satisfies Meta<Element>;
+
+export default meta;
+type Story = StoryObj<Element>;
+
+export const Default: Story = {};
+
+export const WithActions: Story = {
+  render: stencil((args) =>
+    renderChatAiMessage(args, [
+      createAction('Copy message', iconCopy),
+      createAction('Helpful response', iconThumbUp),
+      createAction('Not helpful response', iconThumbDown),
+      createAction('Regenerate response', iconRefresh),
+    ])
+  ),
+};
+
+export const WithActionsAndSources: Story = {
+  render: stencil((args) =>
+    renderChatAiMessage(args, [
+      createAction('Copy message', iconCopy),
+      createAction('Helpful response', iconThumbUp),
+      createAction('Not helpful response', iconThumbDown),
+      createAction('Regenerate response', iconRefresh),
+      createSources(),
+    ])
+  ),
+};
diff --git a/packages/storybook-docs/src/stories/chat-input.stories.tsx b/packages/storybook-docs/src/stories/chat-input.stories.tsx
new file mode 100644
index 00000000000..3b191333f04
--- /dev/null
+++ b/packages/storybook-docs/src/stories/chat-input.stories.tsx
@@ -0,0 +1,194 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import {
+  iconAttach,
+  iconMicrophone,
+  iconRefresh,
+} from '@siemens/ix-icons/icons';
+import type { Components } from '@siemens/ix/components';
+import { h, type VNode } from '@stencil/core';
+import type { ArgTypes, Meta, StoryObj } from '@storybook/web-components-vite';
+import { action } from 'storybook/actions';
+import { stencil } from '@utils/stencil-render';
+import { makeArgTypes } from './utils/generic-render';
+
+type Element = Components.IxChatInput;
+
+function renderChatInput(args: Partial<Element>, children: VNode[] = []) {
+  return (
+    <ix-chat-input
+      {...args}
+      onPromptSubmit={(event: CustomEvent<string>) =>
+        action('promptSubmit')(event.detail)
+      }
+    >
+      {children}
+    </ix-chat-input>
+  );
+}
+
+const meta = {
+  title: 'Example/Chat Input',
+  tags: [],
+  render: stencil((args) => renderChatInput(args)),
+  argTypes: makeArgTypes<Partial<ArgTypes<Element>>>('ix-chat-input'),
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=6316-45495&m=dev',
+    },
+  },
+} satisfies Meta<Element>;
+
+export default meta;
+type Story = StoryObj<Element>;
+
+export const Default: Story = {
+  args: {},
+};
+
+export const WithProcessing: Story = {
+  args: {
+    state: 'processing',
+    value: 'Summarize the current alarm list',
+  },
+};
+
+export const WithValue: Story = {
+  args: {
+    value: 'Summarize the current alarm list',
+  },
+};
+
+export const SoftCharacterLimit: Story = {
+  args: {
+    characterLimit: 30,
+    value: 'Summarize all critical alarms',
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11693-45416&m=dev',
+    },
+  },
+};
+
+export const HardCharacterLimit: Story = {
+  args: {
+    characterLimit: 30,
+    value: 'Summarize all critical alarms now',
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11693-45416&m=dev',
+    },
+  },
+};
+
+function createAttachment(index: number) {
+  return (
+    <ix-chat-prompt-attachment
+      fileName={`file_${String(index).padStart(2, '0')}.txt`}
+      slot="attachments"
+    ></ix-chat-prompt-attachment>
+  );
+}
+
+export const WithAttachments: Story = {
+  render: stencil((args) =>
+    renderChatInput(
+      args,
+      Array.from({ length: 3 }, (_, index) => createAttachment(index + 1))
+    )
+  ),
+  args: {},
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=18263-77406&m=dev',
+    },
+  },
+};
+
+export const WithScrollableAttachments: Story = {
+  render: stencil((args) =>
+    renderChatInput(
+      args,
+      Array.from({ length: 8 }, (_, index) => createAttachment(index + 1))
+    )
+  ),
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=18263-77406&m=dev',
+    },
+  },
+};
+
+function createFollowUpRefreshButton() {
+  return (
+    <ix-icon-button
+      aria-label="Refresh follow-up prompts"
+      icon={iconRefresh}
+      slot="follow-up"
+      variant="secondary"
+    ></ix-icon-button>
+  );
+}
+
+function createFollowUpPrompt(label: string) {
+  return (
+    <ix-button slot="follow-up" variant="secondary">
+      {label}
+    </ix-button>
+  );
+}
+
+export const WithFollowUpPrompts: Story = {
+  render: stencil((args) =>
+    renderChatInput(args, [
+      createFollowUpRefreshButton(),
+      createFollowUpPrompt('What are the risks if this insight is ignored?'),
+      createFollowUpPrompt(
+        'Show related insights from similar customer events.'
+      ),
+      createFollowUpPrompt(
+        'Summarize this insight in 2 bullet points for presentation.'
+      ),
+    ])
+  ),
+  args: {},
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=225-51348&m=dev',
+    },
+  },
+};
+
+export const CustomActions: Story = {
+  render: stencil((args) =>
+    renderChatInput(args, [
+      <ix-icon-button
+        aria-label="Attach file"
+        icon={iconAttach}
+        slot="start"
+        variant="subtle-tertiary"
+      ></ix-icon-button>,
+      <ix-icon-button
+        aria-label="Record voice input"
+        icon={iconMicrophone}
+        slot="end"
+        variant="subtle-tertiary"
+      ></ix-icon-button>,
+    ])
+  ),
+  args: {},
+};
diff --git a/packages/storybook-docs/src/stories/chat-prompt-attachment.stories.tsx b/packages/storybook-docs/src/stories/chat-prompt-attachment.stories.tsx
new file mode 100644
index 00000000000..274fa397dcb
--- /dev/null
+++ b/packages/storybook-docs/src/stories/chat-prompt-attachment.stories.tsx
@@ -0,0 +1,77 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type { Components } from '@siemens/ix/components';
+import { h } from '@stencil/core';
+import type { ArgTypes, Meta, StoryObj } from '@storybook/web-components-vite';
+import { action } from 'storybook/actions';
+import { stencil } from '@utils/stencil-render';
+import { makeArgTypes } from './utils/generic-render';
+
+type Element = Components.IxChatPromptAttachment;
+
+function renderAttachment(args: Partial<Element>) {
+  return (
+    <ix-chat-prompt-attachment
+      {...args}
+      onAttachmentClick={() => action('attachmentClick')()}
+      onRemoveClick={() => action('removeClick')()}
+    ></ix-chat-prompt-attachment>
+  );
+}
+
+const meta = {
+  title: 'Example/Chat Prompt Attachment',
+  tags: [],
+  render: stencil((args) => renderAttachment(args)),
+  argTypes: makeArgTypes<Partial<ArgTypes<Element>>>(
+    'ix-chat-prompt-attachment'
+  ),
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11806-125191&m=dev',
+    },
+  },
+} satisfies Meta<Element>;
+
+export default meta;
+type Story = StoryObj<Element>;
+
+export const Default: Story = {
+  args: {
+    fileName: 'file_01.txt',
+  },
+};
+
+export const PreviewSupported: Story = {
+  args: {
+    fileName: 'file_01.pdf',
+    previewSupported: true,
+  },
+};
+
+export const Loading: Story = {
+  args: {
+    fileName: 'file_01.pdf',
+    status: 'loading',
+  },
+};
+
+export const Failed: Story = {
+  args: {
+    fileName: 'file_01.pdf',
+    status: 'failed',
+  },
+};
+
+export const LongFileName: Story = {
+  args: {
+    fileName: 'meeting_notes_summary_02_with_a_very_long_name.txt',
+  },
+};
diff --git a/packages/storybook-docs/src/stories/chat-user-message.stories.tsx b/packages/storybook-docs/src/stories/chat-user-message.stories.tsx
new file mode 100644
index 00000000000..bbbe611efcb
--- /dev/null
+++ b/packages/storybook-docs/src/stories/chat-user-message.stories.tsx
@@ -0,0 +1,127 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import {
+  iconCopy,
+  iconMoreMenu,
+  iconPen
+} from '@siemens/ix-icons/icons';
+import type { Components } from '@siemens/ix/components';
+import { h, type VNode } from '@stencil/core';
+import type { ArgTypes, Meta, StoryObj } from '@storybook/web-components-vite';
+import { stencil } from '@utils/stencil-render';
+import { makeArgTypes } from './utils/generic-render';
+
+type Element = Components.IxChatUserMessage;
+
+function createAction(label: string, icon: string) {
+  return (
+    <ix-icon-button
+      aria-label={label}
+      icon={icon}
+      size="16"
+      slot="actions"
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  );
+}
+
+function createAttachment(
+  fileName: string,
+  previewSupported = false,
+  slot = 'attachments'
+) {
+  return (
+    <ix-chat-prompt-attachment
+      fileName={fileName}
+      hideRemoveButton
+      previewSupported={previewSupported}
+      slot={slot}
+    ></ix-chat-prompt-attachment>
+  );
+}
+
+function renderChatUserMessage(args: Partial<Element>, children: VNode[] = []) {
+  return <ix-chat-user-message {...args}>{children}</ix-chat-user-message>;
+}
+
+const meta = {
+  title: 'Example/Chat User Message',
+  tags: [],
+  render: stencil((args) => renderChatUserMessage(args)),
+  argTypes: makeArgTypes<Partial<ArgTypes<Element>>>('ix-chat-user-message'),
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11900-149729&m=dev',
+    },
+  },
+} satisfies Meta<Element>;
+
+export default meta;
+type Story = StoryObj<Element>;
+
+export const Default: Story = {
+  args: {
+    message: 'Summarize the detailed discussion held with the customer',
+  },
+};
+
+export const WithActions: Story = {
+  render: stencil((args) =>
+    renderChatUserMessage(args, [
+      createAction('Copy message', iconCopy),
+      createAction('Edit message', iconPen),
+      createAction('Show more actions', iconMoreMenu),
+    ])
+  ),
+  args: {
+    message: 'Summarize the detailed discussion held with the customer',
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11900-151011&m=dev',
+    },
+  },
+};
+
+export const LongMessage: Story = {
+  args: {
+    message:
+      'Summarize the detailed discussion held with the customer and highlight the most important next steps for the service team.',
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11900-151262&m=dev',
+    },
+  },
+};
+
+export const WithAttachments: Story = {
+  render: stencil((args) =>
+    renderChatUserMessage(args, [
+      createAttachment('file_01.pdf', true),
+      createAttachment('file_02.csv'),
+      ...Array.from({ length: 5 }).map((_, i) =>
+        createAttachment(`file_0${i + 3}.jpg`)
+      ),
+    ])
+  ),
+  args: {
+    message: 'Summarize the detailed discussion held with the customer',
+  },
+  parameters: {
+    design: {
+      type: 'figma',
+      url: 'https://www.figma.com/design/KbgPxj7qLgngXkJfnDM4Ty/SDL-AI-UX-Guidelines?node-id=11900-151929&m=dev',
+    },
+  },
+};
+
diff --git a/packages/storybook-docs/src/stories/chat.stories.tsx b/packages/storybook-docs/src/stories/chat.stories.tsx
new file mode 100644
index 00000000000..3eff62248ab
--- /dev/null
+++ b/packages/storybook-docs/src/stories/chat.stories.tsx
@@ -0,0 +1,360 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import {
+  iconAttach,
+  iconCopy,
+  iconGlobe,
+  iconImage,
+  iconMicrophone,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+import type { Components } from '@siemens/ix/components';
+import { h, type VNode } from '@stencil/core';
+import type { ArgTypes, Meta, StoryObj } from '@storybook/web-components-vite';
+import { stencil } from '@utils/stencil-render';
+import { makeArgTypes } from './utils/generic-render';
+
+type Element = Components.IxChat;
+type IconButtonSize = '16' | '24' | '12';
+
+function createIconButton(
+  label: string,
+  icon: string,
+  slot?: string,
+  size: IconButtonSize = '24'
+) {
+  return (
+    <ix-icon-button
+      aria-label={label}
+      icon={icon}
+      size={size}
+      slot={slot}
+      variant="subtle-tertiary"
+    ></ix-icon-button>
+  );
+}
+
+function createAiMessageContent(summary = true) {
+  return [
+    <h3>Text block example</h3>,
+    <p>
+      Effective asset performance management improves uptime, reduces
+      maintenance costs, and ensures long-term equipment health.
+    </p>,
+    summary ? <p>Summary</p> : null,
+  ];
+}
+
+function createAiMessage({
+  actions = false,
+  sources = false,
+}: { actions?: boolean; sources?: boolean } = {}) {
+  return (
+    <ix-chat-ai-message>
+      {createAiMessageContent()}
+      {actions
+        ? [
+            createIconButton('Copy message', iconCopy, 'actions'),
+            createIconButton('Helpful response', iconThumbUp, 'actions'),
+            createIconButton('Not helpful response', iconThumbDown, 'actions'),
+            createIconButton('Regenerate response', iconRefresh, 'actions'),
+          ]
+        : null}
+      {sources ? createSources() : null}
+    </ix-chat-ai-message>
+  );
+}
+
+function createSources() {
+  return (
+    <ix-chip
+      aria-label="Show sources"
+      icon={iconGlobe}
+      outline
+      slot="sources"
+      variant="neutral"
+    >
+      Sources
+    </ix-chip>
+  );
+}
+
+function createUserMessage(
+  message: string,
+  {
+    actions = false,
+    attachments = false,
+    overflow = false,
+  }: { actions?: boolean; attachments?: boolean; overflow?: boolean } = {}
+) {
+  return (
+    <ix-chat-user-message
+      attachmentCount={overflow ? 5 : undefined}
+      message={message}
+    >
+      {actions
+        ? [
+            createIconButton('Copy message', iconCopy, 'actions'),
+            createIconButton('Edit message', iconPen, 'actions'),
+            createIconButton('Show more actions', iconMoreMenu, 'actions'),
+          ]
+        : null}
+      {attachments
+        ? [
+            createSentAttachment('equipment_status.pdf', true),
+            createSentAttachment('maintenance_notes.csv'),
+          ]
+        : null}
+      {overflow
+        ? [
+            'File_01.jpg',
+            'File_02.jpg',
+            'File_03.txt',
+            'File_04.pdf',
+            'File_05.pdf',
+          ].map((fileName) => createAttachmentDropdownItem(fileName))
+        : null}
+    </ix-chat-user-message>
+  );
+}
+
+function createSentAttachment(fileName: string, previewSupported = false) {
+  return (
+    <ix-chat-prompt-attachment
+      fileName={fileName}
+      hideRemoveButton
+      previewSupported={previewSupported}
+      slot="attachments"
+    ></ix-chat-prompt-attachment>
+  );
+}
+
+function createPromptAttachment(
+  fileName: string,
+  status?: 'loading' | 'failed'
+) {
+  return (
+    <ix-chat-prompt-attachment
+      fileName={fileName}
+      slot="attachments"
+      status={status}
+    ></ix-chat-prompt-attachment>
+  );
+}
+
+function getAttachmentIcon(fileName: string) {
+  if (fileName.endsWith('.pdf')) {
+    return iconPdfDocument;
+  }
+
+  if (fileName.endsWith('.txt')) {
+    return iconTxtDocument;
+  }
+
+  return iconImage;
+}
+
+function createAttachmentDropdownItem(
+  fileName: string,
+  slot = 'attachment-overflow'
+) {
+  return (
+    <ix-dropdown-item
+      icon={getAttachmentIcon(fileName)}
+      label={fileName}
+      slot={slot}
+    ></ix-dropdown-item>
+  );
+}
+
+function createChatInput({
+  attachments = false,
+  customActions = false,
+  characterLimit = false,
+  followUp = false,
+  scrollableAttachments = false,
+}: {
+  attachments?: boolean;
+  customActions?: boolean;
+  characterLimit?: boolean;
+  followUp?: boolean;
+  scrollableAttachments?: boolean;
+} = {}) {
+  return (
+    <ix-chat-input
+      attachmentLayout={scrollableAttachments ? 'scroll' : undefined}
+      characterLimit={characterLimit ? 120 : undefined}
+      placeholder="Enter a command, question or topic..."
+      slot="prompt"
+      value={
+        characterLimit
+          ? 'Summarize the uploaded maintenance reports'
+          : undefined
+      }
+    >
+      {followUp
+        ? [
+            createIconButton(
+              'Refresh follow-up prompts',
+              iconRefresh,
+              'follow-up',
+              '24'
+            ),
+            createFollowUpPrompt(
+              'What are the risks if this insight is ignored?'
+            ),
+            createFollowUpPrompt(
+              'Show related insights from similar customer events.'
+            ),
+            createFollowUpPrompt(
+              'Summarize this insight in 2 bullet points for presentation.'
+            ),
+          ]
+        : null}
+      {attachments
+        ? [
+            createPromptAttachment('equipment_status.pdf'),
+            createPromptAttachment('alarm_export.txt'),
+            createPromptAttachment('uploading_report.pdf', 'loading'),
+            createPromptAttachment('failed_upload.csv', 'failed'),
+          ]
+        : null}
+      {customActions
+        ? [
+            createIconButton('Attach file', iconAttach, 'start'),
+            createIconButton('Record voice input', iconMicrophone, 'end', '24'),
+          ]
+        : null}
+    </ix-chat-input>
+  );
+}
+
+function createFollowUpPrompt(label: string) {
+  return (
+    <ix-button slot="follow-up" variant="secondary">
+      {label}
+    </ix-button>
+  );
+}
+
+function createChat(args: Partial<Element>, children: VNode[]) {
+  return (
+    <ix-chat {...args} style={{ height: '40rem' }}>
+      {children}
+    </ix-chat>
+  );
+}
+
+function renderChat(args: Partial<Element>) {
+  return createChat(args, [
+    createUserMessage(
+      'Summarize the detailed discussion held with the customer'
+    ),
+    createAiMessage(),
+    createChatInput(),
+  ]);
+}
+
+const meta = {
+  title: 'Example/Chat',
+  tags: [],
+  render: stencil((args) => renderChat(args)),
+  argTypes: makeArgTypes<Partial<ArgTypes<Element>>>('ix-chat'),
+} satisfies Meta<Element>;
+
+export default meta;
+type Story = StoryObj<Element>;
+
+export const Default: Story = {};
+
+export const WithAiActionsAndSources: Story = {
+  render: stencil((args) =>
+    createChat(args, [
+      createUserMessage('Summarize the current asset performance status'),
+      createAiMessage({ actions: true, sources: true }),
+      createChatInput(),
+    ])
+  ),
+};
+
+export const WithUserMessageAttachments: Story = {
+  render: stencil((args) =>
+    createChat(args, [
+      createUserMessage('Analyze these files and highlight the key risks', {
+        actions: true,
+        attachments: true,
+        overflow: true,
+      }),
+      createAiMessage({ actions: true }),
+      createChatInput(),
+    ])
+  ),
+};
+
+export const WithPromptAttachments: Story = {
+  render: stencil((args) =>
+    createChat(args, [
+      createUserMessage('Compare the uploaded reports'),
+      createAiMessage({ sources: true }),
+      createChatInput({
+        attachments: true,
+        characterLimit: true,
+        customActions: true,
+        followUp: true,
+      }),
+    ])
+  ),
+};
+
+export const WithScrollablePromptAttachments: Story = {
+  render: stencil((args) =>
+    createChat(args, [
+      createUserMessage('Create a summary from all uploaded files'),
+      createAiMessage(),
+      createChatInput({
+        attachments: true,
+        customActions: true,
+        scrollableAttachments: true,
+      }),
+    ])
+  ),
+};
+
+export const FullFeaturedConversation: Story = {
+  render: stencil((args) =>
+    createChat(args, [
+      createUserMessage(
+        'Summarize the detailed discussion held with the customer',
+        {
+          actions: true,
+        }
+      ),
+      createAiMessage({ actions: true, sources: true }),
+      createUserMessage(
+        'Use the attached service reports as additional context',
+        {
+          attachments: true,
+          overflow: true,
+        }
+      ),
+      createAiMessage({ actions: true, sources: true }),
+      createChatInput({
+        attachments: true,
+        characterLimit: true,
+        customActions: true,
+      }),
+    ])
+  ),
+};
diff --git a/packages/storybook-docs/src/stories/utils/stencil-render.ts b/packages/storybook-docs/src/stories/utils/stencil-render.ts
new file mode 100644
index 00000000000..2f778edb289
--- /dev/null
+++ b/packages/storybook-docs/src/stories/utils/stencil-render.ts
@@ -0,0 +1,9 @@
+import { render, type VNode } from '@stencil/core';
+
+export function stencil<T>(callback: (args: T) => VNode) {
+  return (args: T) => {
+    const container = document.createElement('div');
+    render(callback(args), container);
+    return container.firstElementChild as HTMLElement;
+  }
+}
diff --git a/packages/storybook-docs/tsconfig.json b/packages/storybook-docs/tsconfig.json
index 2761b58e89e..c482f968145 100644
--- a/packages/storybook-docs/tsconfig.json
+++ b/packages/storybook-docs/tsconfig.json
@@ -6,6 +6,8 @@
     "module": "ESNext",
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "skipLibCheck": true,
+    "jsx": "react",
+    "jsxFactory": "h",
 
     /* Bundler mode */
     "moduleResolution": "Bundler",
diff --git a/packages/vue-test-app/src/Root.vue b/packages/vue-test-app/src/Root.vue
index 5db51e79fc1..aedd59cd6a7 100644
--- a/packages/vue-test-app/src/Root.vue
+++ b/packages/vue-test-app/src/Root.vue
@@ -50,6 +50,10 @@ import CardList from './preview-examples/card-list.vue';
 import Card from './preview-examples/card.vue';
 import CategoryFilterSuggestions from './preview-examples/category-filter-suggestions.vue';
 import CategoryFilter from './preview-examples/category-filter.vue';
+import Chat from './preview-examples/chat.vue';
+import ChatAiMessage from './preview-examples/chat-ai-message.vue';
+import ChatInput from './preview-examples/chat-input.vue';
+import ChatUserMessage from './preview-examples/chat-user-message.vue';
 import CheckboxIndeterminate from './preview-examples/checkbox-indeterminate.vue';
 import Checkbox from './preview-examples/checkbox.vue';
 import Chip from './preview-examples/chip.vue';
@@ -292,6 +296,10 @@ const routes: IxPreviewRoutes = {
   '/preview/card-list': CardList,
   '/preview/category-filter-suggestions.vue': CategoryFilterSuggestions,
   '/preview/category-filter': CategoryFilter,
+  '/preview/chat': Chat,
+  '/preview/chat-ai-message': ChatAiMessage,
+  '/preview/chat-input': ChatInput,
+  '/preview/chat-user-message': ChatUserMessage,
   '/preview/checkbox-indeterminate': CheckboxIndeterminate,
   '/preview/form-checkbox-group-indeterminate': FormCheckboxGroupIndeterminate,
   '/preview/checkbox': Checkbox,
diff --git a/packages/vue-test-app/src/preview-examples/chat-ai-message.vue b/packages/vue-test-app/src/preview-examples/chat-ai-message.vue
new file mode 100644
index 00000000000..41b2a9606dd
--- /dev/null
+++ b/packages/vue-test-app/src/preview-examples/chat-ai-message.vue
@@ -0,0 +1,70 @@
+<!--
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+-->
+
+<script setup lang="ts">
+import { IxChat, IxChatAiMessage, IxChip, IxIconButton } from '@siemens/ix-vue';
+import {
+  iconCopy,
+  iconGlobe,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+} from '@siemens/ix-icons/icons';
+</script>
+
+<template>
+  <IxChat class="chat-example__chat">
+    <IxChatAiMessage>
+      <h3>Recommended maintenance actions</h3>
+      <p>
+        The compressor is operating within the expected range. Schedule the next
+        inspection during the Friday service window and keep monitoring the
+        vibration trend.
+      </p>
+      <ul>
+        <li>Review the acknowledged alarms from the last shift.</li>
+        <li>
+          Confirm that spare parts are available before the service window.
+        </li>
+        <li>Share the summary with the maintenance lead.</li>
+      </ul>
+      <IxIconButton
+        slot="actions"
+        aria-label="Copy response"
+        :icon="iconCopy"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Helpful response"
+        :icon="iconThumbUp"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Not helpful response"
+        :icon="iconThumbDown"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Regenerate response"
+        :icon="iconRefresh"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxChip slot="sources" :icon="iconGlobe" outline variant="neutral">
+        Sources
+      </IxChip>
+    </IxChatAiMessage>
+  </IxChat>
+</template>
diff --git a/packages/vue-test-app/src/preview-examples/chat-input.vue b/packages/vue-test-app/src/preview-examples/chat-input.vue
new file mode 100644
index 00000000000..79d68a83882
--- /dev/null
+++ b/packages/vue-test-app/src/preview-examples/chat-input.vue
@@ -0,0 +1,63 @@
+<!--
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+-->
+
+<script setup lang="ts">
+import {
+  IxChat,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxIconButton,
+} from '@siemens/ix-vue';
+import {
+  iconImage,
+  iconMicrophone,
+  iconPdfDocument,
+  iconPlus,
+} from '@siemens/ix-icons/icons';
+</script>
+
+<template>
+  <IxChat class="chat-example__chat">
+    <IxChatInput
+      slot="prompt"
+      value="Check open alarms and suggest the next maintenance step."
+      placeholder="Ask about asset status..."
+      textarea-label="Service assistant prompt"
+      :max-length="180"
+      :character-limit="180"
+    >
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="shift_report.pdf"
+        :icon="iconPdfDocument"
+      ></IxChatPromptAttachment>
+      <IxIconButton
+        slot="start"
+        aria-label="Attach file"
+        :icon="iconPlus"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="end"
+        aria-label="Add image"
+        :icon="iconImage"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="end"
+        aria-label="Record voice input"
+        :icon="iconMicrophone"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+    </IxChatInput>
+  </IxChat>
+</template>
diff --git a/packages/vue-test-app/src/preview-examples/chat-user-message.vue b/packages/vue-test-app/src/preview-examples/chat-user-message.vue
new file mode 100644
index 00000000000..d25aa24afdf
--- /dev/null
+++ b/packages/vue-test-app/src/preview-examples/chat-user-message.vue
@@ -0,0 +1,64 @@
+<!--
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+-->
+
+<script setup lang="ts">
+import {
+  IxChat,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxIconButton,
+} from '@siemens/ix-vue';
+import {
+  iconCopy,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+</script>
+
+<template>
+  <IxChat class="chat-example__chat">
+    <IxChatUserMessage message="Summarize the attached shift report.">
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="shift_report.pdf"
+        :icon="iconPdfDocument"
+        hide-remove-button
+      ></IxChatPromptAttachment>
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="operator_notes.txt"
+        :icon="iconTxtDocument"
+        hide-remove-button
+      ></IxChatPromptAttachment>
+      <IxIconButton
+        slot="actions"
+        aria-label="Copy message"
+        :icon="iconCopy"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Edit message"
+        :icon="iconPen"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Show more actions"
+        :icon="iconMoreMenu"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+    </IxChatUserMessage>
+  </IxChat>
+</template>
diff --git a/packages/vue-test-app/src/preview-examples/chat.vue b/packages/vue-test-app/src/preview-examples/chat.vue
new file mode 100644
index 00000000000..800f8e46add
--- /dev/null
+++ b/packages/vue-test-app/src/preview-examples/chat.vue
@@ -0,0 +1,142 @@
+<!--
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+-->
+
+<script setup lang="ts">
+import {
+  IxChat,
+  IxChatAiMessage,
+  IxChatInput,
+  IxChatPromptAttachment,
+  IxChatUserMessage,
+  IxChip,
+  IxIconButton,
+} from '@siemens/ix-vue';
+import {
+  iconCopy,
+  iconGlobe,
+  iconMoreMenu,
+  iconPdfDocument,
+  iconPen,
+  iconRefresh,
+  iconThumbDown,
+  iconThumbUp,
+  iconTxtDocument,
+} from '@siemens/ix-icons/icons';
+</script>
+
+<template>
+  <IxChat class="chat-example__chat">
+    <IxChatUserMessage
+      message="Summarize the asset status and include the attached maintenance files."
+    >
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="equipment_status.pdf"
+        :icon="iconPdfDocument"
+        hide-remove-button
+      ></IxChatPromptAttachment>
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="maintenance_notes.txt"
+        :icon="iconTxtDocument"
+        hide-remove-button
+      ></IxChatPromptAttachment>
+      <IxIconButton
+        slot="actions"
+        aria-label="Copy message"
+        :icon="iconCopy"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Edit message"
+        :icon="iconPen"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Show more actions"
+        :icon="iconMoreMenu"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+    </IxChatUserMessage>
+
+    <IxChatAiMessage>
+      <h3>Asset performance summary</h3>
+      <p>
+        The compressor train is operating inside the expected range. Vibration
+        increased slightly after the last shift change, but all values remain
+        below the warning threshold.
+      </p>
+      <ul class="message-list">
+        <li>Temperature trend is stable over the last 24 hours.</li>
+        <li>Two alarms were acknowledged by the operator.</li>
+        <li>Next service window is scheduled for Friday.</li>
+      </ul>
+      <IxIconButton
+        slot="actions"
+        aria-label="Copy response"
+        :icon="iconCopy"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Helpful response"
+        :icon="iconThumbUp"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Not helpful response"
+        :icon="iconThumbDown"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxIconButton
+        slot="actions"
+        aria-label="Regenerate response"
+        :icon="iconRefresh"
+        size="24"
+        variant="subtle-tertiary"
+      ></IxIconButton>
+      <IxChip slot="sources" :icon="iconGlobe" outline variant="neutral">
+        Sources
+      </IxChip>
+    </IxChatAiMessage>
+
+    <IxChatUserMessage
+      message="Compare the current report with additional customer feedback."
+    >
+      <IxChatPromptAttachment
+        slot="attachments"
+        file-name="customer_feedback.pdf"
+        :icon="iconPdfDocument"
+        hide-remove-button
+      ></IxChatPromptAttachment>
+    </IxChatUserMessage>
+
+    <IxChatAiMessage>
+      <p>
+        Customer feedback confirms the same maintenance priorities. The next
+        step is to validate spare-part availability and confirm the planned
+        downtime window.
+      </p>
+    </IxChatAiMessage>
+
+    <IxChatInput
+      slot="prompt"
+      value="Create a concise follow-up plan for the service team."
+    ></IxChatInput>
+  </IxChat>
+</template>
diff --git a/packages/vue/src/components/components.ts b/packages/vue/src/components/components.ts
index 11c92b32856..362b0087799 100644
--- a/packages/vue/src/components/components.ts
+++ b/packages/vue/src/components/components.ts
@@ -15,6 +15,11 @@ export { IxCardContent } from './ix-card-content.js';
 export { IxCardList } from './ix-card-list.js';
 export { IxCardTitle } from './ix-card-title.js';
 export { IxCategoryFilter } from './ix-category-filter.js';
+export { IxChat } from './ix-chat.js';
+export { IxChatAiMessage } from './ix-chat-ai-message.js';
+export { IxChatInput } from './ix-chat-input.js';
+export { IxChatPromptAttachment } from './ix-chat-prompt-attachment.js';
+export { IxChatUserMessage } from './ix-chat-user-message.js';
 export { IxCheckbox } from './ix-checkbox.js';
 export { IxCheckboxGroup } from './ix-checkbox-group.js';
 export { IxChip } from './ix-chip.js';
diff --git a/packages/vue/src/components/ix-chat-ai-message.ts b/packages/vue/src/components/ix-chat-ai-message.ts
new file mode 100644
index 00000000000..99b481e807d
--- /dev/null
+++ b/packages/vue/src/components/ix-chat-ai-message.ts
@@ -0,0 +1,9 @@
+/* eslint-disable */
+/* tslint:disable */
+/* auto-generated vue proxy */
+import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
+
+import type { JSX } from '@siemens/ix';
+import { defineCustomElement as defineIxChatAiMessage } from '@siemens/ix/components/ix-chat-ai-message.js';
+
+export const IxChatAiMessage: StencilVueComponent<JSX.IxChatAiMessage> = /*@__PURE__*/ defineContainer<JSX.IxChatAiMessage>('ix-chat-ai-message', defineIxChatAiMessage);
diff --git a/packages/vue/src/components/ix-chat-input.ts b/packages/vue/src/components/ix-chat-input.ts
new file mode 100644
index 00000000000..1e337a25db1
--- /dev/null
+++ b/packages/vue/src/components/ix-chat-input.ts
@@ -0,0 +1,36 @@
+/* eslint-disable */
+/* tslint:disable */
+/* auto-generated vue proxy */
+import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
+
+import type { JSX } from '@siemens/ix';
+import { defineCustomElement as defineIxChatInput } from '@siemens/ix/components/ix-chat-input.js';
+
+export const IxChatInput: StencilVueComponent<JSX.IxChatInput, JSX.IxChatInput["value"]> = /*@__PURE__*/ defineContainer<JSX.IxChatInput, JSX.IxChatInput["value"]>('ix-chat-input', defineIxChatInput, [
+  'state',
+  'name',
+  'placeholder',
+  'value',
+  'disabled',
+  'readonly',
+  'textareaLabel',
+  'maxLength',
+  'characterLimit',
+  'i18nCharacterLimitReached',
+  'i18nCharacterLimitWarning',
+  'characterLimitWarningThreshold',
+  'minRows',
+  'maxRows',
+  'insertLineBreakOnEnter',
+  'disclaimer',
+  'valueChange',
+  'ixBlur',
+  'ixChange',
+  'promptSubmit'
+], [
+  'valueChange',
+  'ixBlur',
+  'ixChange',
+  'promptSubmit'
+],
+'value', 'valueChange', undefined);
diff --git a/packages/vue/src/components/ix-chat-prompt-attachment.ts b/packages/vue/src/components/ix-chat-prompt-attachment.ts
new file mode 100644
index 00000000000..de87e19b214
--- /dev/null
+++ b/packages/vue/src/components/ix-chat-prompt-attachment.ts
@@ -0,0 +1,21 @@
+/* eslint-disable */
+/* tslint:disable */
+/* auto-generated vue proxy */
+import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
+
+import type { JSX } from '@siemens/ix';
+import { defineCustomElement as defineIxChatPromptAttachment } from '@siemens/ix/components/ix-chat-prompt-attachment.js';
+
+export const IxChatPromptAttachment: StencilVueComponent<JSX.IxChatPromptAttachment> = /*@__PURE__*/ defineContainer<JSX.IxChatPromptAttachment>('ix-chat-prompt-attachment', defineIxChatPromptAttachment, [
+  'fileName',
+  'status',
+  'icon',
+  'hideRemoveButton',
+  'previewSupported',
+  'removeAriaLabel',
+  'attachmentClick',
+  'removeClick'
+], [
+  'attachmentClick',
+  'removeClick'
+]);
diff --git a/packages/vue/src/components/ix-chat-user-message.ts b/packages/vue/src/components/ix-chat-user-message.ts
new file mode 100644
index 00000000000..454f3b56efa
--- /dev/null
+++ b/packages/vue/src/components/ix-chat-user-message.ts
@@ -0,0 +1,11 @@
+/* eslint-disable */
+/* tslint:disable */
+/* auto-generated vue proxy */
+import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
+
+import type { JSX } from '@siemens/ix';
+import { defineCustomElement as defineIxChatUserMessage } from '@siemens/ix/components/ix-chat-user-message.js';
+
+export const IxChatUserMessage: StencilVueComponent<JSX.IxChatUserMessage> = /*@__PURE__*/ defineContainer<JSX.IxChatUserMessage>('ix-chat-user-message', defineIxChatUserMessage, [
+  'message'
+]);
diff --git a/packages/vue/src/components/ix-chat.ts b/packages/vue/src/components/ix-chat.ts
new file mode 100644
index 00000000000..44cd33d482d
--- /dev/null
+++ b/packages/vue/src/components/ix-chat.ts
@@ -0,0 +1,9 @@
+/* eslint-disable */
+/* tslint:disable */
+/* auto-generated vue proxy */
+import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
+
+import type { JSX } from '@siemens/ix';
+import { defineCustomElement as defineIxChat } from '@siemens/ix/components/ix-chat.js';
+
+export const IxChat: StencilVueComponent<JSX.IxChat> = /*@__PURE__*/ defineContainer<JSX.IxChat>('ix-chat', defineIxChat);
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9fd21d86e9d..fcfbdec6162 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1089,8 +1089,8 @@ importers:
         specifier: 'catalog:'
         version: 3.4.0
       '@stencil/core':
-        specifier: ~4.17.0
-        version: 4.17.2(patch_hash=5b7b26f1b6644ca4134fe78af13f89b6653dffeffd2c09206b7c9402d0470193)
+        specifier: ^4.43.4
+        version: 4.43.5(patch_hash=5b7b26f1b6644ca4134fe78af13f89b6653dffeffd2c09206b7c9402d0470193)
       '@storybook/addon-a11y':
         specifier: ^10.1.11
         version: 10.1.11(storybook@10.1.11(@testing-library/dom@10.4.0)(prettier@3.4.2)(react-dom@19.2.5(react@19.2.5))(react@19.2.5))
diff --git a/testing/framework-tests/__snapshots__/chat-ai-message-aria-snapshot.yaml b/testing/framework-tests/__snapshots__/chat-ai-message-aria-snapshot.yaml
new file mode 100644
index 00000000000..7bf7e165a04
--- /dev/null
+++ b/testing/framework-tests/__snapshots__/chat-ai-message-aria-snapshot.yaml
@@ -0,0 +1,12 @@
+- main:
+  - heading "Recommended maintenance actions" [level=3]
+  - paragraph: The compressor is operating within the expected range. Schedule the next inspection during the Friday service window and keep monitoring the vibration trend.
+  - list:
+    - listitem: Review the acknowledged alarms from the last shift.
+    - listitem: Confirm that spare parts are available before the service window.
+    - listitem: Share the summary with the maintenance lead.
+  - button "Copy response"
+  - button "Helpful response"
+  - button "Not helpful response"
+  - button "Regenerate response"
+  - button "Sources"
\ No newline at end of file
diff --git a/testing/framework-tests/__snapshots__/chat-aria-snapshot.yaml b/testing/framework-tests/__snapshots__/chat-aria-snapshot.yaml
new file mode 100644
index 00000000000..369c2585ddd
--- /dev/null
+++ b/testing/framework-tests/__snapshots__/chat-aria-snapshot.yaml
@@ -0,0 +1,26 @@
+- main:
+    - button "equipment_status .pdf" [disabled]
+    - button "maintenance_notes .txt" [disabled]
+    - text: Summarize the asset status and include the attached maintenance files.
+    - button "Copy message"
+    - button "Edit message"
+    - button "Show more actions"
+    - heading "Asset performance summary" [level=3]
+    - paragraph: The compressor train is operating inside the expected range. Vibration increased slightly after the last shift change, but all values remain below the warning threshold.
+    - list:
+        - listitem: /Temperature trend is stable over the last \d+ hours\./
+        - listitem: Two alarms were acknowledged by the operator.
+        - listitem: Next service window is scheduled for Friday.
+    - button "Copy response"
+    - button "Helpful response"
+    - button "Not helpful response"
+    - button "Regenerate response"
+    - button "Sources"
+    - button "customer_feedback .pdf" [disabled]
+    - text: Compare the current report with additional customer feedback.
+    - paragraph: Customer feedback confirms the same maintenance priorities. The next step is to validate spare-part availability and confirm the planned downtime window.
+    - textbox "Chat input":
+        - /placeholder: Enter a command, question or topic...
+        - text: Create a concise follow-up plan for the service team.
+    - button "Submit prompt"
+    - text: This content is AI-generated. Always verify the information for accuracy.
diff --git a/testing/framework-tests/__snapshots__/chat-input-aria-snapshot.yaml b/testing/framework-tests/__snapshots__/chat-input-aria-snapshot.yaml
new file mode 100644
index 00000000000..bf282bc735d
--- /dev/null
+++ b/testing/framework-tests/__snapshots__/chat-input-aria-snapshot.yaml
@@ -0,0 +1,11 @@
+- main:
+  - button "shift_report .pdf" [disabled]
+  - button "Remove attachment"
+  - textbox "Service assistant prompt":
+    - /placeholder: Ask about asset status...
+    - text: Check open alarms and suggest the next maintenance step.
+  - button "Attach file"
+  - button "Add image"
+  - button "Record voice input"
+  - button "Submit prompt"
+  - text: This content is AI-generated. Always verify the information for accuracy.
\ No newline at end of file
diff --git a/testing/framework-tests/__snapshots__/chat-user-message-aria-snapshot.yaml b/testing/framework-tests/__snapshots__/chat-user-message-aria-snapshot.yaml
new file mode 100644
index 00000000000..755efdf374f
--- /dev/null
+++ b/testing/framework-tests/__snapshots__/chat-user-message-aria-snapshot.yaml
@@ -0,0 +1,7 @@
+- main:
+  - button "shift_report .pdf" [disabled]
+  - button "operator_notes .txt" [disabled]
+  - text: Summarize the attached shift report.
+  - button "Copy message"
+  - button "Edit message"
+  - button "Show more actions"
\ No newline at end of file
diff --git a/testing/framework-tests/tests/generated/axe.ts b/testing/framework-tests/tests/generated/axe.ts
index 8c9ff300b65..2c852ad0343 100644
--- a/testing/framework-tests/tests/generated/axe.ts
+++ b/testing/framework-tests/tests/generated/axe.ts
@@ -35,6 +35,10 @@ import './card-axe.spec.ts';
 import './card-list-axe.spec.ts';
 import './category-filter-axe.spec.ts';
 import './category-filter-suggestions-axe.spec.ts';
+import './chat-ai-message-axe.spec.ts';
+import './chat-axe.spec.ts';
+import './chat-input-axe.spec.ts';
+import './chat-user-message-axe.spec.ts';
 import './checkbox-axe.spec.ts';
 import './checkbox-indeterminate-axe.spec.ts';
 import './chip-axe.spec.ts';
diff --git a/testing/framework-tests/tests/generated/chat-ai-message-axe.spec.ts b/testing/framework-tests/tests/generated/chat-ai-message-axe.spec.ts
new file mode 100644
index 00000000000..68503a08707
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-ai-message-axe.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness, createAxeBuilder } from '../utils';
+
+test('chat-ai-message - accessibility check', async ({ page }) => {
+  await page.goto('/preview/chat-ai-message');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  const accessibilityScanResults = await createAxeBuilder(page).disableRules(['page-has-heading-one']).analyze();
+
+  expect(accessibilityScanResults.violations).toEqual([]);
+});
diff --git a/testing/framework-tests/tests/generated/chat-ai-message.spec.ts b/testing/framework-tests/tests/generated/chat-ai-message.spec.ts
new file mode 100644
index 00000000000..03aad2b697f
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-ai-message.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness } from '../utils';
+
+test('chat-ai-message', async ({ page }) => {
+  await page.goto('/preview/chat-ai-message');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  await expect(page.locator('body')).toMatchAriaSnapshot({
+    name: 'chat-ai-message.aria-snapshot.yaml',
+  });
+});
diff --git a/testing/framework-tests/tests/generated/chat-axe.spec.ts b/testing/framework-tests/tests/generated/chat-axe.spec.ts
new file mode 100644
index 00000000000..57eb9ffc652
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-axe.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness, createAxeBuilder } from '../utils';
+
+test('chat - accessibility check', async ({ page }) => {
+  await page.goto('/preview/chat');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  const accessibilityScanResults = await createAxeBuilder(page).disableRules(['page-has-heading-one']).analyze();
+
+  expect(accessibilityScanResults.violations).toEqual([]);
+});
diff --git a/testing/framework-tests/tests/generated/chat-input-axe.spec.ts b/testing/framework-tests/tests/generated/chat-input-axe.spec.ts
new file mode 100644
index 00000000000..1451bf8f9ff
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-input-axe.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness, createAxeBuilder } from '../utils';
+
+test('chat-input - accessibility check', async ({ page }) => {
+  await page.goto('/preview/chat-input');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  const accessibilityScanResults = await createAxeBuilder(page).disableRules(['page-has-heading-one']).analyze();
+
+  expect(accessibilityScanResults.violations).toEqual([]);
+});
diff --git a/testing/framework-tests/tests/generated/chat-input.spec.ts b/testing/framework-tests/tests/generated/chat-input.spec.ts
new file mode 100644
index 00000000000..28d5e3960f2
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-input.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness } from '../utils';
+
+test('chat-input', async ({ page }) => {
+  await page.goto('/preview/chat-input');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  await expect(page.locator('body')).toMatchAriaSnapshot({
+    name: 'chat-input.aria-snapshot.yaml',
+  });
+});
diff --git a/testing/framework-tests/tests/generated/chat-user-message-axe.spec.ts b/testing/framework-tests/tests/generated/chat-user-message-axe.spec.ts
new file mode 100644
index 00000000000..77fafd3ad47
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-user-message-axe.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness, createAxeBuilder } from '../utils';
+
+test('chat-user-message - accessibility check', async ({ page }) => {
+  await page.goto('/preview/chat-user-message');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  const accessibilityScanResults = await createAxeBuilder(page).disableRules(['page-has-heading-one']).analyze();
+
+  expect(accessibilityScanResults.violations).toEqual([]);
+});
diff --git a/testing/framework-tests/tests/generated/chat-user-message.spec.ts b/testing/framework-tests/tests/generated/chat-user-message.spec.ts
new file mode 100644
index 00000000000..46cd77cc17b
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat-user-message.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness } from '../utils';
+
+test('chat-user-message', async ({ page }) => {
+  await page.goto('/preview/chat-user-message');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  await expect(page.locator('body')).toMatchAriaSnapshot({
+    name: 'chat-user-message.aria-snapshot.yaml',
+  });
+});
diff --git a/testing/framework-tests/tests/generated/chat.spec.ts b/testing/framework-tests/tests/generated/chat.spec.ts
new file mode 100644
index 00000000000..2d3778ea77c
--- /dev/null
+++ b/testing/framework-tests/tests/generated/chat.spec.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-FileCopyrightText: 2025 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ *  This test was autogenerated by 'testing/framework-tests/src/main.ts'
+ *  Do not edit this file directly.
+ */
+import { test, expect } from '@playwright/test';
+import { waitForReadiness } from '../utils';
+
+test('chat', async ({ page }) => {
+  await page.goto('/preview/chat');
+
+  // Ugly and not the reliable way to wait for Stencil to be ready
+  await waitForReadiness(page);
+
+  await expect(page.locator('body')).toMatchAriaSnapshot({
+    name: 'chat.aria-snapshot.yaml',
+  });
+});
diff --git a/testing/framework-tests/tests/generated/index.ts b/testing/framework-tests/tests/generated/index.ts
index acd431f3a96..fc095c51183 100644
--- a/testing/framework-tests/tests/generated/index.ts
+++ b/testing/framework-tests/tests/generated/index.ts
@@ -72,6 +72,14 @@ import './category-filter-axe.spec.ts';
 import './category-filter-suggestions-axe.spec.ts';
 import './category-filter-suggestions.spec.ts';
 import './category-filter.spec.ts';
+import './chat-ai-message-axe.spec.ts';
+import './chat-ai-message.spec.ts';
+import './chat-axe.spec.ts';
+import './chat-input-axe.spec.ts';
+import './chat-input.spec.ts';
+import './chat-user-message-axe.spec.ts';
+import './chat-user-message.spec.ts';
+import './chat.spec.ts';
 import './checkbox-axe.spec.ts';
 import './checkbox-indeterminate-axe.spec.ts';
 import './checkbox-indeterminate.spec.ts';
diff --git a/testing/framework-tests/tests/generated/test-ids.autogenerated.ts b/testing/framework-tests/tests/generated/test-ids.autogenerated.ts
index 607cdb1ace5..9870b0ebeaa 100644
--- a/testing/framework-tests/tests/generated/test-ids.autogenerated.ts
+++ b/testing/framework-tests/tests/generated/test-ids.autogenerated.ts
@@ -209,6 +209,10 @@ export const testIds = [
   "chip",
   "checkbox",
   "checkbox-indeterminate",
+  "chat",
+  "chat-user-message",
+  "chat-input",
+  "chat-ai-message",
   "category-filter",
   "category-filter-suggestions",
   "card",
diff --git a/testing/framework-tests/tests/working-with-axe.spec.ts b/testing/framework-tests/tests/working-with-axe.spec.ts
index a6d7247bde6..13c08204d06 100644
--- a/testing/framework-tests/tests/working-with-axe.spec.ts
+++ b/testing/framework-tests/tests/working-with-axe.spec.ts
@@ -64,3 +64,9 @@ import './generated/pill-variants-axe.spec';
 
 // Chip tests
 import './generated/chip-axe.spec';
+
+// Chat tests
+import './generated/chat-axe.spec';
+import './generated/chat-ai-message-axe.spec';
+import './generated/chat-input-axe.spec';
+import './generated/chat-user-message-axe.spec';
diff --git a/testing/framework-tests/tests/working.spec.ts b/testing/framework-tests/tests/working.spec.ts
index 41225523168..29a590dc4ca 100644
--- a/testing/framework-tests/tests/working.spec.ts
+++ b/testing/framework-tests/tests/working.spec.ts
@@ -64,3 +64,9 @@ import './generated/pill-variants.spec';
 
 // Chip tests
 import './generated/chip.spec';
+
+// Chat tests
+import './generated/chat.spec';
+import './generated/chat-ai-message.spec';
+import './generated/chat-input.spec';
+import './generated/chat-user-message.spec';
diff --git a/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-dark-linux.png b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-dark-linux.png
new file mode 100644
index 00000000000..595277dd85c
Binary files /dev/null and b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-dark-linux.png differ
diff --git a/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-light-linux.png b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-light-linux.png
new file mode 100644
index 00000000000..8c263b071ef
Binary files /dev/null and b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-attachment-overflow-1-chromium---classic-light-linux.png differ
diff --git a/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-dark-linux.png b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-dark-linux.png
new file mode 100644
index 00000000000..cbeaffecb40
Binary files /dev/null and b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-dark-linux.png differ
diff --git a/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-light-linux.png b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-light-linux.png
new file mode 100644
index 00000000000..e88e79795cf
Binary files /dev/null and b/testing/visual-testing/__screenshots__/tests/chat/chat.e2e.ts/chat-overview-1-chromium---classic-light-linux.png differ
diff --git a/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-dark-linux.png b/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-dark-linux.png
index ee4feb23bb9..90c83cdf796 100644
Binary files a/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-dark-linux.png and b/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-dark-linux.png differ
diff --git a/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-light-linux.png b/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-light-linux.png
index 54f8f328538..d614363ab9f 100644
Binary files a/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-light-linux.png and b/testing/visual-testing/__screenshots__/tests/chip/chip.e2e.ts/chip-custom-1-chromium---classic-light-linux.png differ
diff --git a/testing/visual-testing/tests/chat/chat.e2e.ts b/testing/visual-testing/tests/chat/chat.e2e.ts
new file mode 100644
index 00000000000..66aaf7d8d70
--- /dev/null
+++ b/testing/visual-testing/tests/chat/chat.e2e.ts
@@ -0,0 +1,41 @@
+/*
+ * SPDX-FileCopyrightText: 2026 Siemens AG
+ *
+ * SPDX-License-Identifier: MIT
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { expect } from '@playwright/test';
+import { regressionTest } from '@utils/test';
+
+regressionTest.describe('chat', () => {
+  regressionTest('overview', async ({ page }) => {
+    await page.setViewportSize({ width: 1280, height: 1000 });
+    await page.goto('chat/overview');
+
+    await page.locator('ix-chat-user-message').first().hover();
+
+    await expect(page).toHaveScreenshot({
+      animations: 'disabled',
+      fullPage: true,
+    });
+  });
+
+  regressionTest('attachment overflow', async ({ page }) => {
+    await page.setViewportSize({ width: 1280, height: 900 });
+    await page.goto('chat/overflow');
+
+    const promptAttachments = page
+      .locator('ix-chat-input')
+      .locator('.attachments');
+
+    await expect(promptAttachments).toHaveClass(/has-attachment-scrollbar/);
+
+    await expect(page).toHaveScreenshot({
+      animations: 'disabled',
+      fullPage: true,
+    });
+  });
+});
diff --git a/testing/visual-testing/tests/chat/overflow/index.html b/testing/visual-testing/tests/chat/overflow/index.html
new file mode 100644
index 00000000000..2e9831b9d6a
--- /dev/null
+++ b/testing/visual-testing/tests/chat/overflow/index.html
@@ -0,0 +1,149 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"
+    />
+    <title>Chat attachment overflow and prompt scroll</title>
+    <style>
+      :root {
+        color: var(--theme-color-std-text);
+        font-family: var(--theme-font-family);
+      }
+
+      .chat-visual-page {
+        min-height: 100vh;
+        box-sizing: border-box;
+        padding: 1.5rem;
+        background: var(--theme-color-1);
+      }
+
+      .chat-visual-title {
+        margin: 0 0 1rem;
+        font-size: 1rem;
+        font-weight: 700;
+      }
+
+      ix-chat.chat-overflow {
+        width: 36rem;
+        height: 34rem;
+        min-width: 0;
+        border: 1px solid var(--theme-color-weak-bdr);
+        border-radius: var(--theme-default-border-radius);
+        background: var(--theme-color-1);
+      }
+
+      ix-chat-input {
+        width: 100%;
+      }
+    </style>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconAttach,
+        iconCloseSmall,
+        iconError,
+        iconSendRightFilled,
+        iconTxtDocument,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconAttach,
+        iconCloseSmall,
+        iconError,
+        iconSendRightFilled,
+        iconTxtDocument,
+      });
+    </script>
+  </head>
+  <body>
+    <main class="chat-visual-page">
+      <h1 class="chat-visual-title">Attachment overflow and prompt scroll</h1>
+      <ix-chat class="chat-overflow">
+        <ix-chat-ai-message>
+          <p>
+            Several sent attachments are available in the message overflow. The
+            prompt keeps uploaded files in a horizontal scroll area.
+          </p>
+        </ix-chat-ai-message>
+
+        <ix-chat-user-message
+          message="Use these documents for the final summary."
+          attachment-count="3"
+        >
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="summary.pdf"
+            variant="sent"
+            hide-remove-button
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="risk-register.xlsx"
+            variant="sent"
+            hide-remove-button
+          ></ix-chat-prompt-attachment>
+          <ix-dropdown-item
+            slot="attachment-overflow"
+            label="customer-feedback.pdf"
+          ></ix-dropdown-item>
+          <ix-dropdown-item
+            slot="attachment-overflow"
+            label="service-plan.docx"
+          ></ix-dropdown-item>
+          <ix-dropdown-item
+            slot="attachment-overflow"
+            label="audit-log.csv"
+          ></ix-dropdown-item>
+        </ix-chat-user-message>
+
+        <ix-chat-input
+          attachment-layout="scroll"
+          slot="prompt"
+          value="Compare all attached documents."
+          style="width: 18rem"
+        >
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="asset-health-overview.pdf"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="maintenance-window-plan.xlsx"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="alarm-history-q4.csv"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="operator-notes.txt"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="safety-checklist.pdf"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+          <ix-chat-prompt-attachment
+            slot="attachments"
+            file-name="commissioning-report.docx"
+            preview-supported
+          ></ix-chat-prompt-attachment>
+        </ix-chat-input>
+      </ix-chat>
+    </main>
+    <script src="./../../utils/test/runtime/main.ts" type="module"></script>
+  </body>
+</html>
diff --git a/testing/visual-testing/tests/chat/overview/index.html b/testing/visual-testing/tests/chat/overview/index.html
new file mode 100644
index 00000000000..2fbd6248cd2
--- /dev/null
+++ b/testing/visual-testing/tests/chat/overview/index.html
@@ -0,0 +1,293 @@
+<!--
+SPDX-FileCopyrightText: 2026 Siemens AG
+
+SPDX-License-Identifier: MIT
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"
+    />
+    <title>Chat visual overview</title>
+    <style>
+      :root {
+        color: var(--theme-color-std-text);
+        font-family: var(--theme-font-family);
+      }
+
+      .chat-visual-page {
+        min-height: 100vh;
+        box-sizing: border-box;
+        padding: 1.5rem;
+        background: var(--theme-color-1);
+      }
+
+      .chat-visual-grid {
+        display: grid;
+        grid-template-columns: minmax(34rem, 45rem) minmax(20rem, 28rem);
+        gap: 1.5rem;
+        align-items: start;
+      }
+
+      .chat-visual-panel {
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+        min-width: 0;
+      }
+
+      .chat-visual-title {
+        margin: 0;
+        font-size: 1rem;
+        font-weight: 700;
+      }
+
+      ix-chat.chat-overview {
+        height: 48rem;
+        min-width: 0;
+        max-width: none;
+        border: 1px solid var(--theme-color-weak-bdr);
+        border-radius: var(--theme-default-border-radius);
+        background: var(--theme-color-1);
+      }
+
+      ix-chat-ai-message .message-list {
+        margin: 0;
+        padding-left: 1.25rem;
+      }
+
+      .chat-actions {
+        display: inline-flex;
+        gap: 0.25rem;
+      }
+
+      .input-state-list {
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+      }
+
+      .attachment-state-row {
+        display: grid;
+        grid-template-columns: 1fr;
+        gap: 0.5rem;
+        max-width: 18rem;
+      }
+
+      .attachment-state-row ix-chat-prompt-attachment {
+        width: 100%;
+      }
+
+      .state-caption {
+        margin: 0 0 0.375rem;
+        color: var(--theme-color-soft-text);
+        font-size: 0.75rem;
+      }
+    </style>
+    <script type="module">
+      import { addIcons } from '@siemens/ix-icons';
+      import {
+        iconAttach,
+        iconCircleStop,
+        iconCloseSmall,
+        iconError,
+        iconInfo,
+        iconRefresh,
+        iconSendRightFilled,
+        iconStar,
+        iconTxtDocument,
+      } from '@siemens/ix-icons/icons';
+
+      addIcons({
+        iconAttach,
+        iconCircleStop,
+        iconCloseSmall,
+        iconError,
+        iconInfo,
+        iconRefresh,
+        iconSendRightFilled,
+        iconStar,
+        iconTxtDocument,
+      });
+    </script>
+  </head>
+  <body>
+    <main class="chat-visual-page">
+      <div class="chat-visual-grid">
+        <section class="chat-visual-panel" aria-label="Chat conversation">
+          <h1 class="chat-visual-title">Conversation with prompt</h1>
+          <ix-chat class="chat-overview">
+            <ix-chat-ai-message>
+              <h2>Asset performance summary</h2>
+              <p>
+                The compressor train is stable. Vibration increased slightly
+                after the last shift change, but all values remain below the
+                warning threshold.
+              </p>
+              <ul class="message-list">
+                <li>Temperature trend is flat over the last 24 hours.</li>
+                <li>Two alarms were acknowledged by the operator.</li>
+              </ul>
+              <span slot="actions" class="chat-actions">
+                <ix-icon-button
+                  aria-label="Copy response"
+                  icon="star"
+                  size="24"
+                  variant="subtle-tertiary"
+                ></ix-icon-button>
+                <ix-button variant="subtle-tertiary">Regenerate</ix-button>
+              </span>
+              <ix-pill slot="sources" outline variant="neutral">
+                Sources
+              </ix-pill>
+            </ix-chat-ai-message>
+
+            <ix-chat-user-message
+              message="Summarize the customer discussion and include related attachments."
+              attachment-count="2"
+            >
+              <ix-chat-prompt-attachment
+                slot="attachments"
+                file-name="meeting_notes_summary.pdf"
+                variant="sent"
+                hide-remove-button
+                preview-supported
+              ></ix-chat-prompt-attachment>
+              <ix-chat-prompt-attachment
+                slot="attachments"
+                file-name="customer_scope.xlsx"
+                variant="sent"
+                hide-remove-button
+              ></ix-chat-prompt-attachment>
+              <ix-dropdown-item
+                slot="attachment-overflow"
+                label="initial_requirements.pdf"
+              ></ix-dropdown-item>
+              <ix-dropdown-item
+                slot="attachment-overflow"
+                label="maintenance_report.xlsx"
+              ></ix-dropdown-item>
+              <ix-icon-button
+                slot="actions"
+                aria-label="Copy user message"
+                icon="star"
+                size="24"
+                variant="subtle-tertiary"
+              ></ix-icon-button>
+              <ix-button slot="actions" variant="subtle-tertiary">
+                Edit
+              </ix-button>
+            </ix-chat-user-message>
+
+            <ix-chat-ai-message>
+              <p>
+                The discussion focused on reducing unplanned downtime and
+                improving handover quality for service teams.
+              </p>
+            </ix-chat-ai-message>
+
+            <ix-chat-input
+              slot="prompt"
+              value="Create a concise follow-up plan for the service team."
+              character-limit="55"
+              attachment-layout="scroll"
+            >
+              <ix-icon-button
+                slot="follow-up"
+                aria-label="Refresh follow-up prompts"
+                icon="refresh"
+                size="24"
+                variant="tertiary"
+              ></ix-icon-button>
+              <ix-button slot="follow-up" variant="secondary">
+                What are the biggest risks?
+              </ix-button>
+              <ix-button slot="follow-up" variant="secondary">
+                Show related alarms.
+              </ix-button>
+              <ix-chat-prompt-attachment
+                slot="attachments"
+                file-name="handover_notes.pdf"
+                preview-supported
+              ></ix-chat-prompt-attachment>
+              <ix-chat-prompt-attachment
+                slot="attachments"
+                file-name="trend_export.csv"
+                status="loading"
+              ></ix-chat-prompt-attachment>
+              <ix-chat-prompt-attachment
+                slot="attachments"
+                file-name="fault_tree.xlsx"
+                status="failed"
+              ></ix-chat-prompt-attachment>
+              <ix-icon-button
+                slot="start"
+                aria-label="Attach file"
+                icon="star"
+                size="24"
+                variant="tertiary"
+              ></ix-icon-button>
+              <ix-button slot="end" variant="tertiary">Refine</ix-button>
+            </ix-chat-input>
+          </ix-chat>
+        </section>
+
+        <section class="chat-visual-panel" aria-label="Chat input states">
+          <h2 class="chat-visual-title">Input and attachment states</h2>
+          <div class="input-state-list">
+            <div>
+              <p class="state-caption">Processing</p>
+              <ix-chat-input
+                state="processing"
+                value="Generating an answer from the selected sources."
+              ></ix-chat-input>
+            </div>
+            <div>
+              <p class="state-caption">Character limit reached</p>
+              <ix-chat-input
+                value="1234567890"
+                character-limit="10"
+              ></ix-chat-input>
+            </div>
+            <div>
+              <p class="state-caption">Readonly</p>
+              <ix-chat-input
+                readonly
+                value="The prompt is kept for review."
+              ></ix-chat-input>
+            </div>
+            <div>
+              <p class="state-caption">Disabled</p>
+              <ix-chat-input
+                disabled
+                value="Prompt unavailable"
+              ></ix-chat-input>
+            </div>
+            <div>
+              <p class="state-caption">Prompt attachment states</p>
+              <div class="attachment-state-row">
+                <ix-chat-prompt-attachment
+                  file-name="manual.pdf"
+                  preview-supported
+                ></ix-chat-prompt-attachment>
+                <ix-chat-prompt-attachment
+                  file-name="uploading.csv"
+                  status="loading"
+                ></ix-chat-prompt-attachment>
+                <ix-chat-prompt-attachment
+                  file-name="failed-upload.xlsx"
+                  status="failed"
+                ></ix-chat-prompt-attachment>
+              </div>
+            </div>
+          </div>
+        </section>
+      </div>
+    </main>
+    <script src="./../../utils/test/runtime/main.ts" type="module"></script>
+  </body>
+</html>