diff --git a/web/src/admin/applications/ApplicationListPage.ts b/web/src/admin/applications/ApplicationListPage.ts
index 0e12505ec..5987297fa 100644
--- a/web/src/admin/applications/ApplicationListPage.ts
+++ b/web/src/admin/applications/ApplicationListPage.ts
@@ -59,6 +59,10 @@ export class ApplicationListPage extends TablePage<Application> {
             PFAvatar,
             PFCard,
             css`
+                :host {
+                    --icon-height: 2rem;
+                    --icon-border: 0.25rem;
+                }
                 /* Fix alignment issues with images in tables */
                 .pf-c-table tbody > tr > * {
                     vertical-align: middle;
@@ -72,6 +76,14 @@ export class ApplicationListPage extends TablePage<Application> {
                 .pf-c-sidebar.pf-m-gutter > .pf-c-sidebar__main > * + * {
                     margin-left: calc(var(--pf-c-sidebar__main--child--MarginLeft) / 2);
                 }
+                .icon {
+                    font-size: var(--icon-height);
+                    color: var(--ak-global--Color--100);
+                    padding: var(--icon-border);
+                    max-height: calc(var(--icon-height) + var(--icon-border) + var(--icon-border));
+                    line-height: calc(var(--icon-height) + var(--icon-border) + var(--icon-border));
+                    filter: drop-shadow(5px 5px 5px rgba(128, 128, 128, 0.25));
+                }
             `,
         );
     }
@@ -129,15 +141,15 @@ export class ApplicationListPage extends TablePage<Application> {
         if (item?.metaIcon) {
             if (item.metaIcon.startsWith("fa://")) {
                 const icon = item.metaIcon.replaceAll("fa://", "");
-                return html`<i class="fas ${icon}"></i>`;
+                return html`<i class="icon fas ${icon}"></i>`;
             }
             return html`<img
-                class="app-icon pf-c-avatar"
+                class="icon pf-c-avatar"
                 src="${ifDefined(item.metaIcon)}"
                 alt="${msg("Application Icon")}"
             />`;
         }
-        return html`<i class="fas fa-share-square"></i>`;
+        return html`<span class="icon">${item?.name.charAt(0).toUpperCase()}</span>`;
     }
 
     row(item: Application): TemplateResult[] {
diff --git a/web/src/user/LibraryApplication.ts b/web/src/user/LibraryApplication.ts
index eff21dbb2..be9e0d2a8 100644
--- a/web/src/user/LibraryApplication.ts
+++ b/web/src/user/LibraryApplication.ts
@@ -64,6 +64,7 @@ export class LibraryApplication extends AKElement {
                     padding: var(--icon-border);
                     max-height: calc(var(--icon-height) + var(--icon-border) + var(--icon-border));
                     line-height: calc(var(--icon-height) + var(--icon-border) + var(--icon-border));
+                    filter: drop-shadow(5px 5px 5px rgba(128, 128, 128, 0.25));
                 }
                 .expander {
                     flex-grow: 1;
@@ -86,7 +87,7 @@ export class LibraryApplication extends AKElement {
                 return html`<i class="icon fas ${icon}"></i>`;
             }
             return html`<img
-                class="app-icon pf-c-avatar"
+                class="icon pf-c-avatar"
                 src="${ifDefined(this.application.metaIcon)}"
                 alt="${msg("Application Icon")}"
             />`;
@@ -121,7 +122,7 @@ export class LibraryApplication extends AKElement {
                 >
             </div>
             <div class="expander"></div>
-            <ak-expand>
+            <ak-expand textOpen=${msg("Less details")} textClosed=${msg("More details")}>
                 <div class="pf-c-content">
                     <small>${this.application.metaPublisher}</small>
                 </div>