diff --git a/app/soapbox/components/media_gallery.js b/app/soapbox/components/media_gallery.js
index d4782d3b1..ffe8bc0e1 100644
--- a/app/soapbox/components/media_gallery.js
+++ b/app/soapbox/components/media_gallery.js
@@ -11,6 +11,7 @@ import { getSettings } from 'soapbox/actions/settings';
 import Blurhash from 'soapbox/components/blurhash';
 import Icon from 'soapbox/components/icon';
 import StillImage from 'soapbox/components/still_image';
+import { MIMETYPE_ICONS } from 'soapbox/features/compose/components/upload';
 import { truncateFilename } from 'soapbox/utils/media';
 
 import { isIOS } from '../is_mobile';
@@ -146,11 +147,18 @@ class Item extends React.PureComponent {
 
     if (attachment.get('type') === 'unknown') {
       const filename = truncateFilename(attachment.get('remote_url'), MAX_FILENAME_LENGTH);
+      const attachmentIcon = (
+        <Icon
+          className='h-16 w-16 text-gray-800 dark:text-gray-200'
+          src={MIMETYPE_ICONS[attachment.getIn(['pleroma', 'mime_type'])] || require('@tabler/icons/icons/paperclip.svg')}
+        />
+      );
+
       return (
         <div className={classNames('media-gallery__item', { standalone })} key={attachment.get('id')} style={{ position, float, left, top, right, bottom, height, width: `${width}%` }}>
           <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url')} target='_blank' style={{ cursor: 'pointer' }}>
             <Blurhash hash={attachment.get('blurhash')} className='media-gallery__preview' />
-            <span className='media-gallery__item__icons'><Icon id='file' /></span>
+            <span className='media-gallery__item__icons'>{attachmentIcon}</span>
             <span className='media-gallery__filename__label'>{filename}</span>
           </a>
         </div>
diff --git a/app/soapbox/features/compose/components/upload.js b/app/soapbox/features/compose/components/upload.js
index 6c3ef5638..184b6b612 100644
--- a/app/soapbox/features/compose/components/upload.js
+++ b/app/soapbox/features/compose/components/upload.js
@@ -13,38 +13,45 @@ import IconButton from 'soapbox/components/icon_button';
 
 import Motion from '../../ui/util/optional_motion';
 
-const MIMETYPE_ICONS = {
-  'application/x-freearc': 'file-archive-o',
-  'application/x-bzip': 'file-archive-o',
-  'application/x-bzip2': 'file-archive-o',
-  'application/gzip': 'file-archive-o',
-  'application/vnd.rar': 'file-archive-o',
-  'application/x-tar': 'file-archive-o',
-  'application/zip': 'file-archive-o',
-  'application/x-7z-compressed': 'file-archive-o',
-  'application/x-csh': 'file-code-o',
-  'application/html': 'file-code-o',
-  'text/javascript': 'file-code-o',
-  'application/json': 'file-code-o',
-  'application/ld+json': 'file-code-o',
-  'application/x-httpd-php': 'file-code-o',
-  'application/x-sh': 'file-code-o',
-  'application/xhtml+xml': 'file-code-o',
-  'application/xml': 'file-code-o',
-  'application/epub+zip': 'file-epub-o',
-  'application/vnd.oasis.opendocument.spreadsheet': 'file-excel-o',
-  'application/vnd.ms-excel': 'file-excel-o',
-  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'file-excel-o',
-  'application/pdf': 'file-pdf-o',
-  'application/vnd.oasis.opendocument.presentation': 'file-powerpoint-o',
-  'application/vnd.ms-powerpoint': 'file-powerpoint-o',
-  'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'file-powerpoint-o',
-  'text/plain': 'file-text-o',
-  'application/rtf': 'file-text-o',
-  'application/msword': 'file-word-o',
-  'application/x-abiword': 'file-word-o',
-  'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'file-word-o',
-  'application/vnd.oasis.opendocument.text': 'file-word-o',
+const bookIcon = require('@tabler/icons/icons/book.svg');
+const fileAnalyticsIcon = require('@tabler/icons/icons/file-analytics.svg');
+const fileCodeIcon = require('@tabler/icons/icons/file-code.svg');
+const fileTextIcon = require('@tabler/icons/icons/file-text.svg');
+const fileZipIcon = require('@tabler/icons/icons/file-zip.svg');
+const presentationIcon = require('@tabler/icons/icons/presentation.svg');
+
+export const MIMETYPE_ICONS = {
+  'application/x-freearc': fileZipIcon,
+  'application/x-bzip': fileZipIcon,
+  'application/x-bzip2': fileZipIcon,
+  'application/gzip': fileZipIcon,
+  'application/vnd.rar': fileZipIcon,
+  'application/x-tar': fileZipIcon,
+  'application/zip': fileZipIcon,
+  'application/x-7z-compressed': fileZipIcon,
+  'application/x-csh': fileCodeIcon,
+  'application/html': fileCodeIcon,
+  'text/javascript': fileCodeIcon,
+  'application/json': fileCodeIcon,
+  'application/ld+json': fileCodeIcon,
+  'application/x-httpd-php': fileCodeIcon,
+  'application/x-sh': fileCodeIcon,
+  'application/xhtml+xml': fileCodeIcon,
+  'application/xml': fileCodeIcon,
+  'application/epub+zip': bookIcon,
+  'application/vnd.oasis.opendocument.spreadsheet': fileAnalyticsIcon,
+  'application/vnd.ms-excel': fileAnalyticsIcon,
+  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': fileAnalyticsIcon,
+  'application/pdf': fileTextIcon,
+  'application/vnd.oasis.opendocument.presentation': presentationIcon,
+  'application/vnd.ms-powerpoint': presentationIcon,
+  'application/vnd.openxmlformats-officedocument.presentationml.presentation': presentationIcon,
+  'text/plain': fileTextIcon,
+  'application/rtf': fileTextIcon,
+  'application/msword': fileTextIcon,
+  'application/x-abiword': fileTextIcon,
+  'application/vnd.openxmlformats-officedocument.wordprocessingml.document': fileTextIcon,
+  'application/vnd.oasis.opendocument.text': fileTextIcon,
 };
 
 const messages = defineMessages({
@@ -137,7 +144,8 @@ class Upload extends ImmutablePureComponent {
     const mediaType = media.get('type');
     const uploadIcon = mediaType === 'unknown' && (
       <Icon
-        id={MIMETYPE_ICONS[media.getIn(['pleroma', 'mime_type'])] || 'paperclip'}
+        className='h-16 w-16 mx-auto my-12 text-gray-800 dark:text-gray-200'
+        src={MIMETYPE_ICONS[media.getIn(['pleroma', 'mime_type'])] || require('@tabler/icons/icons/paperclip.svg')}
       />
     );
 
diff --git a/app/styles/components/compose-form.scss b/app/styles/components/compose-form.scss
index d81481b07..4682d5123 100644
--- a/app/styles/components/compose-form.scss
+++ b/app/styles/components/compose-form.scss
@@ -184,14 +184,6 @@
           height: 100%;
           object-fit: cover;
         }
-
-        > i.fa {
-          width: 100%;
-          color: hsla(var(--primary-text-color_hsl), 0.4);
-          font-size: 64px;
-          text-align: center;
-          line-height: 160px;
-        }
       }
     }