diff --git a/src/App.tsx b/src/App.tsx
index 5183349dbc26f263f642c58cd0c234804f64967f..5279e89bd76752473dd481d4087c9d71a3644806 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -4,12 +4,13 @@ import { ClientContextProvider } from './context';
 import ThemeProvider from './context/ThemeProvider';
 import { UserStateProvider } from './context/UserContext';
 import Routes from './Routes';
+import { darkTheme } from './theme';
 
 function App(): React.ReactElement {
   return (
     <ClientContextProvider>
       <UserStateProvider>
-        <ThemeProvider>
+        <ThemeProvider theme={darkTheme}>
           <Router>
             <Routes />
           </Router>
diff --git a/src/theme.ts b/src/theme.ts
index 879796ecb471f9c92b1da7dce9dad5ea9d765b69..a72bf25fda295c49038289bc62c64c97e04b84be 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -1,8 +1,9 @@
 import { createMuiTheme } from '@material-ui/core';
 
 // eslint-disable-next-line import/prefer-default-export
-export const theme = createMuiTheme(/* {
-  palette: {
+export const theme = createMuiTheme({
+  // TODO: Create default theme
+  /*   palette: {
     primary: {},
     secondary: {},
     error: {},
@@ -12,8 +13,33 @@ export const theme = createMuiTheme(/* {
     grey: {},
 
     text: {},
+  }, */
+  typography: {
+    fontFamily: 'Roboto',
+  },
+});
+
+export const darkTheme = createMuiTheme({
+  palette: {
+    primary: {
+      main: '#1A6B97',
+      contrastText: '#FFFFFF',
+    },
+    secondary: {
+      main: '#FFD200',
+      contrastText: '#202020',
+    },
+    error: {
+      main: '#FF0C3E',
+    },
+    background: {
+      default: '#222222',
+    },
+    success: {},
+    info: {},
+    warning: {},
   },
   typography: {
     fontFamily: 'Roboto',
   },
-} */);
+});