diff --git a/resources/scripts/components/App.tsx b/resources/scripts/components/App.tsx
index dad6ef137..13764bbf8 100644
--- a/resources/scripts/components/App.tsx
+++ b/resources/scripts/components/App.tsx
@@ -10,10 +10,11 @@ import AuthenticationRouter from '@/routers/AuthenticationRouter';
 import { SiteSettings } from '@/state/settings';
 import ProgressBar from '@/components/elements/ProgressBar';
 import NotFound from '@/components/screens/NotFound';
-import tw, { GlobalStyles as TailwindGlobalStyles } from 'twin.macro';
+import tw from 'twin.macro';
 import GlobalStylesheet from '@/assets/css/GlobalStylesheet';
 import { history } from '@/components/history';
 import { setupInterceptors } from '@/api/interceptors';
+import TailwindGlobalStyles from '@/components/GlobalStyles';
 
 const ChunkedAdminRouter = lazy(() => import(/* webpackChunkName: "admin" */'@/routers/AdminRouter'));
 
diff --git a/resources/scripts/components/GlobalStyles.tsx b/resources/scripts/components/GlobalStyles.tsx
new file mode 100644
index 000000000..8c87749a6
--- /dev/null
+++ b/resources/scripts/components/GlobalStyles.tsx
@@ -0,0 +1,6 @@
+import React from 'react';
+import { GlobalStyles } from 'twin.macro';
+
+export default () => {
+    return <GlobalStyles/>;
+};