diff --git a/src/components/cardbuilder/card.css b/src/components/cardbuilder/card.css
index 99a8526d9..5eef7fc32 100644
--- a/src/components/cardbuilder/card.css
+++ b/src/components/cardbuilder/card.css
@@ -365,7 +365,7 @@ button::-moz-focus-inner {
 }
 
 .cardImageIcon {
-    font-size: 5em;
+    font-size: 5em !important;
     color: inherit;
 }
 
diff --git a/src/controllers/dashboard/devices/devices.js b/src/controllers/dashboard/devices/devices.js
index d2cb0ad8c..448ad3527 100644
--- a/src/controllers/dashboard/devices/devices.js
+++ b/src/controllers/dashboard/devices/devices.js
@@ -4,6 +4,7 @@ import globalize from '../../../scripts/globalize';
 import imageHelper from '../../../scripts/imagehelper';
 import { formatDistanceToNow } from 'date-fns';
 import { localeWithSuffix } from '../../../scripts/dfnshelper';
+import * as cardBuilder from '../../../components/cardbuilder/cardBuilder.js';
 import '../../../elements/emby-button/emby-button';
 import '../../../elements/emby-itemscontainer/emby-itemscontainer';
 import '../../../components/cardbuilder/card.css';
@@ -96,7 +97,7 @@ import confirm from '../../../components/confirm/confirm';
             deviceHtml += '<div class="cardBox visualCardBox">';
             deviceHtml += '<div class="cardScalable">';
             deviceHtml += '<div class="cardPadder cardPadder-backdrop"></div>';
-            deviceHtml += '<a is="emby-linkbutton" href="' + (canEdit ? '#!/device.html?id=' + device.Id : '#') + '" class="cardContent cardImageContainer">';
+            deviceHtml += `<a is="emby-linkbutton" href="${canEdit ? '#!/device.html?id=' + device.Id : '#'}" class="cardContent cardImageContainer ${cardBuilder.getDefaultBackgroundClass()}">`;
             const iconUrl = imageHelper.getDeviceIcon(device);
 
             if (iconUrl) {
diff --git a/src/controllers/dashboard/plugins/available/index.js b/src/controllers/dashboard/plugins/available/index.js
index 179d4f71b..efd84355f 100644
--- a/src/controllers/dashboard/plugins/available/index.js
+++ b/src/controllers/dashboard/plugins/available/index.js
@@ -105,7 +105,12 @@ function getPluginHtml(plugin, options, installedPlugins) {
     html += '<div class="cardPadder cardPadder-backdrop"></div>';
     html += `<div class="cardContent ${cardBuilder.getDefaultBackgroundClass()}">`;
     html += `<a class="cardImageContainer" is="emby-linkbutton" href="${href}" ${target}>`;
-    html += '<span class="cardImageIcon material-icons extension"></span>';
+    html += `<span class="cardImageIcon ${plugin.ImageUrl ? '' : 'material-icons extension'}">`;
+    if (plugin.ImageUrl) {
+        html += `<img src="${plugin.ImageUrl}" style="width:100%;height:auto" />`;
+    }
+
+    html += '</span>';
     html += '</a>';
     html += '</div>';
     html += '</div>';
diff --git a/src/controllers/dashboard/plugins/installed/index.js b/src/controllers/dashboard/plugins/installed/index.js
index aa1032d57..b7a1e3aed 100644
--- a/src/controllers/dashboard/plugins/installed/index.js
+++ b/src/controllers/dashboard/plugins/installed/index.js
@@ -67,10 +67,11 @@ function getPluginCardHtml(plugin, pluginConfigurationPages) {
         html += '<div class="cardImageContainer noConfigPluginCard noHoverEffect emby-button">';
     }
 
-    html += `<span class="cardImageIcon ${plugin.HasImage ? 'material-icons extension' : ''}">`;
+    html += `<span class="cardImageIcon ${plugin.HasImage ? '' : 'material-icons extension'}">`;
     if (plugin.HasImage) {
         html += `<img src="/Plugins/${plugin.Id}/${plugin.Version}/Image" style="width:100%;height:auto" />`;
     }
+
     html += '</span>';
     html += configPageUrl ? '</a>' : '</div>';
     html += '</div>';