diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-dark-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-dark-linux.png
index 310bf50b3..64b88049d 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8d7da212e9e92db15c9facbbd76182887f618772ce7c17f95b1bd5f979f53ba4
-size 15265
+oid sha256:38f70e3e9fbba4e386bfd78fa6a314d8a4ad9fda01686dd497e8657255674000
+size 26105
diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-light-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-light-linux.png
index a987b03a2..fd9ba4d7b 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-attachment-list-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:dc95bf5ca7aea3133bff198080adb1b37bab9789458fa05c1cb8df3e3c881c5a
-size 14723
+oid sha256:9c5684a44c247caab182aed72e24cd6c58e1a2985c62d172e7624f78dbd57dc9
+size 24351
diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png
index 8bbcbf5d8..4844b12d9 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:604029968b0f0b53a979dfbabe60502e0e977c5d7e55cfbdb49c9e4b6e976b43
-size 46740
+oid sha256:5e3597de3e755d309ae9b3a29ab566835e0896eea6be687b18e80796ad06bf1a
+size 46783
diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png
index b76727c50..b3da1ae60 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-container-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:854c8533026cb932a9b388907e2f6c63d03d429bbff0db85a99293d9a34ab865
-size 45251
+oid sha256:cbae34e194872fe35967c30eb43931bbc9187667a6d7f334a7f034465fad1b5b
+size 45082
diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-dark-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-dark-linux.png
index fba3087b7..582ebe247 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-dark-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-dark-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a6e4ea3b7b4885b996072d1a134f6dc252b56bf9d4816dfacaf7bd87e76bb9da
-size 15992
+oid sha256:1c3df3a717a7c7759402185b754d3dd655f0d4fb8e3d47cd425fe51917fee7f1
+size 16066
diff --git a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-light-linux.png b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-light-linux.png
index 8b207a736..e2585b160 100644
--- a/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-light-linux.png
+++ b/playwright/snapshots/static.spec.ts-snapshots/si-chat-messages--si-chat-input-element-examples-chromium-light-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ecdb5c7bf46f0504041eefbb3ea91025948935d272e740de58028de0832db516
-size 15752
+oid sha256:d4d9c2f91b7b2bf80fd5a889481e41c1ebbaddd897dde9030cdbfee8f7428b07
+size 15519
diff --git a/projects/element-ng/chat-messages/si-attachment-list.component.scss b/projects/element-ng/chat-messages/si-attachment-list.component.scss
index cc3cddc82..6c5f57d23 100644
--- a/projects/element-ng/chat-messages/si-attachment-list.component.scss
+++ b/projects/element-ng/chat-messages/si-attachment-list.component.scss
@@ -2,7 +2,8 @@
 @use '@siemens/element-theme/src/styles/variables';
 
 :host {
-  --attachment-list-bg: #{variables.$element-base-1-hover};
+  --attachment-list-bg: #{variables.$element-base-1};
+  --attachment-list-bg-hover: #{variables.$element-base-1-hover};
   --attachment-name-color: #{variables.$element-text-primary};
 }
 
@@ -23,6 +24,10 @@
   text-align: inherit;
   color: inherit;
   cursor: pointer;
+
+  &:hover {
+    background-color: var(--attachment-list-bg-hover);
+  }
 }
 
 .attachment-icon {
diff --git a/src/app/examples/si-chat-messages/si-attachment-list.html b/src/app/examples/si-chat-messages/si-attachment-list.html
index 1a541bf4f..695644e29 100644
--- a/src/app/examples/si-chat-messages/si-attachment-list.html
+++ b/src/app/examples/si-chat-messages/si-attachment-list.html
@@ -1,29 +1,47 @@
-<div class="p-2">
-  <si-attachment-list
-    alignment="start"
-    removeLabel="Remove attachment"
-    [attachments]="attachments"
-    [removable]="true"
-    (remove)="onRemoveAttachment($event)"
-  />
-
+<div class="m-4">
+  <div class="si-h5 mt-4">Removable attachments</div>
   <div class="mt-5">
-    <si-attachment-list alignment="start" [attachments]="readOnlyAttachments" [removable]="false" />
-  </div>
-</div>
+    <si-attachment-list
+      alignment="start"
+      removeLabel="Remove attachment"
+      [attachments]="attachments"
+      [removable]="true"
+      (remove)="onRemoveAttachment($event)"
+    />
+
+    <div class="si-h5 mt-8">Read-only attachments</div>
 
-<ng-template #modalTemplate let-modalRef="modalRef" let-attachment="attachment">
-  <div class="modal-header">
-    <h4 class="modal-title" id="sample-modal-title">{{ attachment.name }}</h4>
-    <button
-      type="button"
-      class="btn btn-circle btn-ghost element-cancel"
-      aria-label="Close modal"
-      (click)="modalRef.hide('cancel')"
-    >
-    </button>
+    <div class="mt-5">
+      <si-attachment-list
+        alignment="start"
+        [attachments]="readOnlyAttachments"
+        [removable]="false"
+      />
+    </div>
+
+    <div class="si-h5 mt-8">Non-previewable attachments</div>
+
+    <div class="mt-5">
+      <si-attachment-list
+        alignment="start"
+        [attachments]="noPreviewAttachments"
+        [removable]="false"
+      />
+    </div>
   </div>
-  <div class="modal-body">
-    <span>This is a sample modal to demonstrate attachment preview functionality.</span>
-  </div></ng-template
->
+  <ng-template #modalTemplate let-modalRef="modalRef" let-attachment="attachment">
+    <div class="modal-header">
+      <h4 class="modal-title" id="sample-modal-title">{{ attachment.name }}</h4>
+      <button
+        type="button"
+        class="btn btn-circle btn-ghost element-cancel"
+        aria-label="Close modal"
+        (click)="modalRef.hide('cancel')"
+      >
+      </button>
+    </div>
+    <div class="modal-body">
+      <span>This is a sample modal to demonstrate attachment preview functionality.</span>
+    </div>
+  </ng-template>
+</div>
diff --git a/src/app/examples/si-chat-messages/si-attachment-list.ts b/src/app/examples/si-chat-messages/si-attachment-list.ts
index 1fa13314a..e701cb46b 100644
--- a/src/app/examples/si-chat-messages/si-attachment-list.ts
+++ b/src/app/examples/si-chat-messages/si-attachment-list.ts
@@ -54,6 +54,21 @@ export class SampleComponent {
     }
   ];
 
+  noPreviewAttachments: Attachment[] = [
+    {
+      name: 'budget-quarterly.pptx'
+    },
+    {
+      name: 'data.json'
+    },
+    {
+      name: 'barchart.png'
+    },
+    {
+      name: 'event.ics'
+    }
+  ];
+
   onRemoveAttachment(attachment: Attachment): void {
     this.logEvent(`Remove attachment: ${attachment.name}`);