diff --git a/src/index.tsx b/src/index.tsx
index a3ec08d..25d770f 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,19 +1,24 @@
 import React from 'react';
 import { render } from 'react-dom';
 import { HelmetProvider } from 'react-helmet-async';
+import { ThemeProvider } from 'styled-components';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { Provider } from 'react-redux';
 import { store } from './redux/store';
 import App from './App';
 
+import { theme } from './styles/styled';
+
 render(
   <Provider store={store}>
-    <HelmetProvider>
-      <DndProvider backend={HTML5Backend}>
-        <App />
-      </DndProvider>
-    </HelmetProvider>
+    <ThemeProvider theme={theme}>
+      <HelmetProvider>
+        <DndProvider backend={HTML5Backend}>
+          <App />
+        </DndProvider>
+      </HelmetProvider>
+    </ThemeProvider>
   </Provider>,
   document.getElementById('root')
 );
diff --git a/src/styles/styled.ts b/src/styles/styled.ts
new file mode 100644
index 0000000..7cea91d
--- /dev/null
+++ b/src/styles/styled.ts
@@ -0,0 +1,3 @@
+export const theme = {
+  main: '#1179ac',
+};