diff --git a/src/components/appBar.js b/src/components/appBar.js
index ca5e39649..949a68b7e 100644
--- a/src/components/appBar.js
+++ b/src/components/appBar.js
@@ -38,7 +38,7 @@
     };
 
     const logo = useText(logoSource);
-    const LogoCmp = logo && <img src={logo} width={logoWidth} alt="" />;
+    const LogoCmp = logo && <img src={logo} className={classes.logo} alt="" />;
     const LogoComponent = endpoint.id ? (
       // eslint-disable-next-line jsx-a11y/anchor-is-valid
       <Link endpoint={endpoint}>{LogoCmp}</Link>
@@ -107,6 +107,9 @@
         ],
         zIndex: '1201 !important',
       },
+      logo:{
+        width: ({ options: { logoWidth } }) => logoWidth,
+      },
       toolbar: {
         flexDirection: ({ options: { alignItems } }) =>
           alignItems === 'right' ? 'row' : 'row-reverse',