diff --git a/App.tsx b/App.tsx
index d2f4443..ebf3387 100644
--- a/App.tsx
+++ b/App.tsx
@@ -2,11 +2,14 @@ import 'react-native-gesture-handler';
 import {NavigationContainer} from '@react-navigation/native';
 import {createDrawerNavigator} from '@react-navigation/drawer';
 
+import CustomDrawerContent from './src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent';
+import DrawerScreenSettings from './src/Components/Drawer/DrawerScreenSettings/DrawerScreenSettings';
+
 import Home from './src/Routes/Home/Home';
 import UserInfo from './src/Routes/UserInfo/UserInfo';
 import AddNote from './src/Routes/AddNote/AddNote';
-import CustomDrawerContent from './src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent';
-import DrawerScreenSettings from './src/Components/Drawer/DrawerScreenSettings/DrawerScreenSettings';
+import Login from './src/Routes/Login/Login';
+import Register from './src/Routes/Register/Register';
 
 const Drawer = createDrawerNavigator();
 
@@ -20,6 +23,8 @@ export default function App() {
         <Drawer.Screen name="Home" component={Home} />
         <Drawer.Screen name="Add Note" component={AddNote} />
         <Drawer.Screen name="User Info" component={UserInfo} />
+        <Drawer.Screen name="Login" component={Login} />
+        <Drawer.Screen name="Register" component={Register} />
       </Drawer.Navigator>
     </NavigationContainer>
   );
diff --git a/babel.config.js b/babel.config.js
index e73e59d..ac4c1ed 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,6 +1,6 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
   plugins:[
-    'react-native-reanimated/plugin',
+    'react-native-reanimated/plugin'
   ],
 };
diff --git a/src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent.tsx b/src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent.tsx
index 0a9a342..3b26503 100644
--- a/src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent.tsx
+++ b/src/Components/Drawer/DrawerScreenSettings/CustomDrawerContent/CustomDrawerContent.tsx
@@ -16,68 +16,64 @@ import AppIcon from '../../../Icons/AppIcon/AppIcon';
 
 export default function CustomDrawerContent(props: {}) {
   const navigation = useNavigation<RootDrawerParamList>();
-  let width = 224;
+  const width = 224;
   return (
     <DrawerContentScrollView {...props}>
-      <View>
-        <View style={{...styles.flex_row, ...{marginLeft: 16}}}>
-          <AppIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>
-            Clip Notes
-          </Text>
-        </View>
-        <ButtonAlignLeft
-          color="Blue"
-          width={width}
-          onPress={() => {
-            navigation.navigate('Home');
-          }}>
-          <HomeIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>Home</Text>
-        </ButtonAlignLeft>
-        <ButtonAlignLeft
-          color="Green"
-          width={width}
-          onPress={() => {
-            navigation.navigate('Add Note');
-          }}>
-          <AddIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>
-            Add Note
-          </Text>
-        </ButtonAlignLeft>
-        <ButtonAlignLeft
-          color="Green"
-          width={width}
-          onPress={() => {
-            navigation.navigate('Login');
-          }}>
-          <LoginIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>Login</Text>
-        </ButtonAlignLeft>
-        <ButtonAlignLeft
-          color="Yellow"
-          width={width}
-          onPress={() => {
-            navigation.navigate('User Info');
-          }}>
-          <UserIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>
-            User Info
-          </Text>
-        </ButtonAlignLeft>
-        <ButtonAlignLeft
-          color="Yellow"
-          width={width}
-          onPress={() => {
-            navigation.navigate('Register');
-          }}>
-          <SignupIcon size={32} color="white" />
-          <Text style={{...styles.text_white, ...{fontSize: 32}}}>
-            Register
-          </Text>
-        </ButtonAlignLeft>
+      <View
+        style={{
+          ...styles.flex_row,
+          ...{justifyContent: 'center'},
+        }}>
+        <AppIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>
+          Clip Notes
+        </Text>
       </View>
+      <ButtonAlignLeft
+        color="Blue"
+        width={width}
+        onPress={() => {
+          navigation.navigate('Home');
+        }}>
+        <HomeIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>Home</Text>
+      </ButtonAlignLeft>
+      <ButtonAlignLeft
+        color="Green"
+        width={width}
+        onPress={() => {
+          navigation.navigate('Add Note');
+        }}>
+        <AddIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>Add Note</Text>
+      </ButtonAlignLeft>
+      <ButtonAlignLeft
+        color="Green"
+        width={width}
+        onPress={() => {
+          navigation.navigate('Login');
+        }}>
+        <LoginIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>Login</Text>
+      </ButtonAlignLeft>
+      <ButtonAlignLeft
+        color="Yellow"
+        width={width}
+        onPress={() => {
+          navigation.navigate('User Info');
+        }}>
+        <UserIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>User Info</Text>
+      </ButtonAlignLeft>
+      <ButtonAlignLeft
+        color="Yellow"
+        width={width}
+        onPress={() => {
+          navigation.navigate('Register');
+        }}>
+        <SignupIcon size={32} color="white" />
+        <Text style={{...styles.text_white, ...{fontSize: 32}}}>Register</Text>
+      </ButtonAlignLeft>
     </DrawerContentScrollView>
   );
 }
diff --git a/src/Routes/Home/Home.tsx b/src/Routes/Home/Home.tsx
index b8131e6..92a8f8e 100644
--- a/src/Routes/Home/Home.tsx
+++ b/src/Routes/Home/Home.tsx
@@ -5,12 +5,6 @@ import Background from '../../Components/Background/Background';
 import {useNavigation} from '@react-navigation/native';
 import {RootDrawerParamList} from '../../Interfaces/Interfaces';
 import AppIcon from '../../Components/Icons/AppIcon/AppIcon';
-import Button from '../../Components/Buttons/ButtonCentered/ButtonCentered';
-import HomeIcon from '../../Components/Icons/HomeIcon/HomeIcon';
-import AddIcon from '../../Components/Icons/AddIcon/AddIcon';
-import UserIcon from '../../Components/Icons/UserIcon/UserIcon';
-import LoginIcon from '../../Components/Icons/LoginIcon/LoginIcon';
-import SignupIcon from '../../Components/Icons/SignupIcon/SignupIcon';
 
 export interface props {}
 
diff --git a/src/Routes/Login/Login.tsx b/src/Routes/Login/Login.tsx
new file mode 100644
index 0000000..9191564
--- /dev/null
+++ b/src/Routes/Login/Login.tsx
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import {View, Text} from 'react-native';
+import styles from '../../styles';
+import Background from '../../Components/Background/Background';
+
+export interface props {}
+
+export default function Login(props: props) {
+  return (
+    <Background>
+      <Text style={{...styles.text_white, ...{fontSize: 32}}}>Login</Text>
+    </Background>
+  );
+}
diff --git a/src/Routes/Register/Register.tsx b/src/Routes/Register/Register.tsx
new file mode 100644
index 0000000..8af2a07
--- /dev/null
+++ b/src/Routes/Register/Register.tsx
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import {View, Text} from 'react-native';
+import styles from '../../styles';
+import Background from '../../Components/Background/Background';
+
+export interface props {}
+
+export default function Register(props: props) {
+  return (
+    <Background>
+      <Text style={{...styles.text_white, ...{fontSize: 32}}}>Register</Text>
+    </Background>
+  );
+}
diff --git a/tsconfig.json b/tsconfig.json
index 45a6c70..b71c72c 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,3 +1,3 @@
 {
-  "extends": "@tsconfig/react-native/tsconfig.json"
+  "extends": "@tsconfig/react-native/tsconfig.json",
 }