diff --git a/striker-ui/components/Display/FullSize.tsx b/striker-ui/components/Display/FullSize.tsx
index d70fa6fb..60680dfc 100644
--- a/striker-ui/components/Display/FullSize.tsx
+++ b/striker-ui/components/Display/FullSize.tsx
@@ -1,6 +1,7 @@
 import { useState, useRef, useEffect, Dispatch, SetStateAction } from 'react';
 import dynamic from 'next/dynamic';
-import { Box, Menu, MenuItem, Typography, Button } from '@material-ui/core';
+import { Box, Menu, MenuItem, Button } from '@material-ui/core';
+import Typography from '@mui/material/Typography';
 import { makeStyles } from '@material-ui/core/styles';
 import CloseIcon from '@material-ui/icons/Close';
 import KeyboardIcon from '@material-ui/icons/Keyboard';
diff --git a/striker-ui/components/Servers.tsx b/striker-ui/components/Servers.tsx
index 172bafc9..b2f96785 100644
--- a/striker-ui/components/Servers.tsx
+++ b/striker-ui/components/Servers.tsx
@@ -9,8 +9,8 @@ import {
   Checkbox,
   Menu,
   MenuItem,
-  Typography,
 } from '@material-ui/core';
+import Typography from '@mui/material/Typography';
 import EditIcon from '@material-ui/icons/Edit';
 import MoreVertIcon from '@material-ui/icons/MoreVert';
 import CheckIcon from '@material-ui/icons/Check';
diff --git a/striker-ui/components/Text/BodyText.tsx b/striker-ui/components/Text/BodyText.tsx
index 0be31cba..be270060 100644
--- a/striker-ui/components/Text/BodyText.tsx
+++ b/striker-ui/components/Text/BodyText.tsx
@@ -1,4 +1,4 @@
-import { Typography } from '@material-ui/core';
+import Typography from '@mui/material/Typography';
 import { makeStyles } from '@material-ui/core/styles';
 import { TEXT, UNSELECTED } from '../../lib/consts/DEFAULT_THEME';
 
diff --git a/striker-ui/components/Text/HeaderText.tsx b/striker-ui/components/Text/HeaderText.tsx
index a2c38923..959213b3 100644
--- a/striker-ui/components/Text/HeaderText.tsx
+++ b/striker-ui/components/Text/HeaderText.tsx
@@ -1,12 +1,10 @@
-import { Typography } from '@material-ui/core';
-import { withStyles } from '@material-ui/core/styles';
+import Typography from '@mui/material/Typography';
+import { styled } from '@mui/material/styles';
 import { TEXT } from '../../lib/consts/DEFAULT_THEME';
 
-const WhiteTypography = withStyles({
-  root: {
-    color: TEXT,
-  },
-})(Typography);
+const WhiteTypography = styled(Typography)({
+  color: TEXT,
+});
 
 const HeaderText = ({ text }: { text: string }): JSX.Element => {
   return <WhiteTypography variant="h4">{text}</WhiteTypography>;