diff --git a/src/common/layout/LayoutBadgeImageView.tsx b/src/common/layout/LayoutBadgeImageView.tsx
index 3445abc4..e859cd4b 100644
--- a/src/common/layout/LayoutBadgeImageView.tsx
+++ b/src/common/layout/LayoutBadgeImageView.tsx
@@ -1,4 +1,4 @@
-import { BadgeImageReadyEvent, NitroSprite, TextureUtils } from '@nitrots/nitro-renderer';
+import { BadgeImageReadyEvent, Nitro, NitroSprite, TextureUtils } from '@nitrots/nitro-renderer';
 import { CSSProperties, FC, useEffect, useMemo, useState } from 'react';
 import { GetConfiguration, GetSessionDataManager, LocalizeBadgeDescription, LocalizeBadgeName, LocalizeText } from '../../api';
 import { Base, BaseProps } from '../Base';
@@ -37,7 +37,7 @@ export const LayoutBadgeImageView: FC<LayoutBadgeImageViewProps> = props =>
 
         if(imageElement)
         {
-            newStyle.backgroundImage = `url('${ imageElement.src }')`;
+            newStyle.backgroundImage = (isGroup || isGrayscale) ? imageElement.src : `url(${ Nitro.instance.getConfiguration<string>('badge.asset.url').replace('%badgename%', badgeCode.toString()) })`;
             newStyle.width = imageElement.width;
             newStyle.height = imageElement.height;
 
@@ -46,7 +46,7 @@ export const LayoutBadgeImageView: FC<LayoutBadgeImageViewProps> = props =>
                 newStyle.transform = `scale(${ scale })`;
 
                 if(!(scale % 1)) newStyle.imageRendering = 'pixelated';
-            
+
                 newStyle.width = (imageElement.width * scale);
                 newStyle.height = (imageElement.height * scale);
             }
@@ -72,7 +72,7 @@ export const LayoutBadgeImageView: FC<LayoutBadgeImageViewProps> = props =>
             element.onload = () => setImageElement(element);
 
             didSetBadge = true;
-            
+
             GetSessionDataManager().events.removeEventListener(BadgeImageReadyEvent.IMAGE_READY, onBadgeImageReadyEvent);
         }