First HomePage Style

src/App.tsx

 import React, { FC } from 'react';
 import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';
+import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
 import { HomePage2 } from './components/AuthUser/HomePage2/HomePage2';
 
+const theme = createMuiTheme({
+  palette: {
+    primary: {
+      main: '#5e5ce4',
+    },
+    secondary: {
+      main: '#e2e45c',
+    },
+  },
+
+  typography: {
+    fontSize: 16,
+  },
+
+  overrides: {
+    MuiTabs: {
+      indicator: {
+        backgroundColor: 'white',
+      },
+    },
+  },
+});
+
 export const App: FC = () => (
   <Router>
     <Switch>
       <Route path="/">
         <div data-testid="App">
-          <HomePage2 />
+          <ThemeProvider theme={theme}>
+            <HomePage2 />
+          </ThemeProvider>
         </div>
       </Route>
     </Switch>

src/components/AuthUser/HomePage2/HomePage2.tsx

 import React, { FC } from 'react';
 import { makeStyles } from '@material-ui/core/styles';
-import { CssBaseline } from '@material-ui/core';
+import { CssBaseline, Tabs, Tab, Paper } from '@material-ui/core';
 
 const useStyles = makeStyles((theme) => ({
   root: {
     minHeight: '100vh',
-    backgroundImage: `url(${'bg.png'})`,
+    backgroundImage: `url(${'/assets/bg2.png'})`,
+    backgroundRepeat: 'no-repeat',
+    backgroundSize: 'cover',
+  },
+  tabs: {
+    color: 'white',
+    paddingLeft: '25px',
+    paddingTop: '8px',
+  },
+  tabPan: {
+    paddingLeft: '56px',
+    paddingRight: '56px',
+  },
+  leftAlign: {
+    marginRight: 'auto',
   },
 }));
 
 export const HomePage2: FC = () => {
   const classes = useStyles();
 
+  const [selectedTab, setSelectedTab] = React.useState(0);
+
   return (
     <div className={classes.root}>
       <CssBaseline />
+      <Tabs value={selectedTab} className={classes.tabs}>
+        <Tab label="HomePage" className={classes.tabPan} />
+        <Tab label="Reservation" className={classes.tabPan} />
+        <Tab
+          label="Profile"
+          className={`${classes.tabPan} ${classes.leftAlign}`}
+        />
+      </Tabs>
     </div>
   );
 };