diff --git a/public/img/fileicons/.htaccess b/public/img/fileicons/.htaccess
new file mode 100644
index 0000000..05d0416
--- /dev/null
+++ b/public/img/fileicons/.htaccess
@@ -0,0 +1,3 @@
+RewriteEngine on
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteRule \.png$ unknown.png [L]
\ No newline at end of file
diff --git a/public/img/fileicons/doc.png b/public/img/fileicons/doc.png
new file mode 100644
index 0000000..d302d9c
Binary files /dev/null and b/public/img/fileicons/doc.png differ
diff --git a/public/img/fileicons/docx.png b/public/img/fileicons/docx.png
new file mode 100644
index 0000000..7ed6d75
Binary files /dev/null and b/public/img/fileicons/docx.png differ
diff --git a/public/img/fileicons/file-icons.png b/public/img/fileicons/file-icons.png
new file mode 100644
index 0000000..efbcbbc
Binary files /dev/null and b/public/img/fileicons/file-icons.png differ
diff --git a/public/img/fileicons/pdf.png b/public/img/fileicons/pdf.png
new file mode 100644
index 0000000..250c2e1
Binary files /dev/null and b/public/img/fileicons/pdf.png differ
diff --git a/public/img/fileicons/png.png b/public/img/fileicons/png.png
new file mode 100644
index 0000000..3370a9d
Binary files /dev/null and b/public/img/fileicons/png.png differ
diff --git a/public/img/fileicons/svg.png b/public/img/fileicons/svg.png
new file mode 100644
index 0000000..da2d5ae
Binary files /dev/null and b/public/img/fileicons/svg.png differ
diff --git a/public/img/fileicons/unknown.png b/public/img/fileicons/unknown.png
new file mode 100644
index 0000000..f5feb75
Binary files /dev/null and b/public/img/fileicons/unknown.png differ
diff --git a/public/img/fileicons/xls.png b/public/img/fileicons/xls.png
new file mode 100644
index 0000000..2951d01
Binary files /dev/null and b/public/img/fileicons/xls.png differ
diff --git a/public/img/fileicons/xml.png b/public/img/fileicons/xml.png
new file mode 100644
index 0000000..3201fd6
Binary files /dev/null and b/public/img/fileicons/xml.png differ
diff --git a/public/img/fileicons/zip.png b/public/img/fileicons/zip.png
new file mode 100644
index 0000000..5ef0e3a
Binary files /dev/null and b/public/img/fileicons/zip.png differ
diff --git a/resources/js/components/SMAttachments.vue b/resources/js/components/SMAttachments.vue
new file mode 100644
index 0000000..0870144
--- /dev/null
+++ b/resources/js/components/SMAttachments.vue
@@ -0,0 +1,72 @@
+<template>
+    <SMContainer class="sm-attachments">
+        <h3 v-if="props.attachments && props.attachments.length > 0">
+            Attachments
+        </h3>
+        <div
+            v-for="file of props.attachments"
+            :key="file.id"
+            class="attachment-row">
+            <div class="attachment-file-icon">
+                <img
+                    :src="getFileIconImagePath(file.title || file.name)"
+                    height="48"
+                    width="48" />
+            </div>
+            <a :href="file.url" class="attachment-file-name">{{
+                file.title || file.name
+            }}</a>
+            <div class="attachment-file-size">
+                ({{ bytesReadable(file.size) }})
+            </div>
+        </div>
+    </SMContainer>
+</template>
+
+<script setup lang="ts">
+import { bytesReadable } from "../helpers/types";
+import SMContainer from "./SMContainer.vue";
+
+const props = defineProps({
+    attachments: {
+        type: Object,
+        required: true,
+    },
+});
+
+const getFileIconImagePath = (fileName: string): string => {
+    const ext = fileName.split(".").pop();
+    return `/img/fileicons/${ext}.png`;
+};
+</script>
+
+<style lang="scss">
+.sm-attachments {
+    h3 {
+        margin-top: map-get($spacer, 3);
+    }
+
+    .attachment-row {
+        border-bottom: 1px solid $secondary-background-color;
+        display: flex;
+        align-items: center;
+        padding: 0.5rem 0;
+
+        &:last-child {
+            border-bottom: 0;
+        }
+
+        .attachment-file-icon {
+            display: flex;
+            width: 64px;
+            justify-content: center;
+        }
+
+        .attachment-file-size {
+            font-size: 75%;
+            padding-left: 0.75rem;
+            color: $secondary-color-dark;
+        }
+    }
+}
+</style>
diff --git a/resources/js/views/NewsView.vue b/resources/js/views/NewsView.vue
index c96ab06..70a6223 100644
--- a/resources/js/views/NewsView.vue
+++ b/resources/js/views/NewsView.vue
@@ -19,6 +19,7 @@
                 </div>
             </div>
             <component :is="formattedContent" ref="content"></component>
+            <SMAttachments :attachments="post.attachments" />
         </SMContainer>
     </SMPage>
 </template>
@@ -30,6 +31,7 @@ import { SMDate } from "../helpers/datetime";
 import { useApplicationStore } from "../store/ApplicationStore";
 import { api } from "../helpers/api";
 import SMPage from "../components/SMPage.vue";
+import SMAttachments from "../components/SMAttachments.vue";
 
 const applicationStore = useApplicationStore();
 const route = useRoute();