diff --git a/App.js b/App.js
index 53457002..b93d9665 100644
--- a/App.js
+++ b/App.js
@@ -1,9 +1,12 @@
 import React, { useEffect } from "react";
 import { StatusBar } from "react-native";
 
+import * as SplashScreen from "expo-splash-screen";
+
+SplashScreen.preventAutoHideAsync();
+
 import { useFonts } from "expo-font";
 import { Provider as PaperProvider } from "react-native-paper";
-import * as SplashScreen from "expo-splash-screen";
 import { Provider } from "react-redux";
 import { persistor, store } from "./src/redux/store";
 import { PersistGate } from "redux-persist/lib/integration/react";
@@ -18,7 +21,9 @@ const App = () => {
 
     useEffect(() => {
         createDB();
-        SplashScreen.hideAsync();
+        setTimeout(async () => {
+            await SplashScreen.hideAsync();
+        }, 2000);
     }, []);
 
     if (!loaded) {
diff --git a/src/Screens/Browse/BrowseMal.js b/src/Screens/Browse/BrowseMal.js
index e60f007f..1edfe4b9 100644
--- a/src/Screens/Browse/BrowseMal.js
+++ b/src/Screens/Browse/BrowseMal.js
@@ -25,7 +25,6 @@ const BrowseMalScreen = ({ navigation, route }) => {
     const getNovels = async () => {
         try {
             const url = `https://api.jikan.moe/v3/top/manga/1/novels`;
-            console.log(url);
 
             const res = await fetch(url);
             const data = await res.json();
@@ -69,15 +68,12 @@ const BrowseMalScreen = ({ navigation, route }) => {
 
     const getSearchResults = () => {
         setLoading(true);
-        console.log(
-            `https://api.jikan.moe/v3/search/manga?q=${searchText}&page=1&type=novel`
-        );
+
         fetch(
             `https://api.jikan.moe/v3/search/manga?q=${searchText}&page=1&type=novel`
         )
             .then((response) => response.json())
             .then((json) => {
-                console.log(json.results);
                 setNovels(json.results);
                 setLoading(false);
             })
diff --git a/src/Screens/Chapter/Chapter.js b/src/Screens/Chapter/Chapter.js
index f831e7a9..8c9ae121 100644
--- a/src/Screens/Chapter/Chapter.js
+++ b/src/Screens/Chapter/Chapter.js
@@ -194,7 +194,7 @@ const Chapter = ({ route, navigation }) => {
             paddingVertical: 16,
             paddingBottom: 32,
             fontSize: reader.textSize,
-            color: readerTextColor(reader.theme),
+            color: reader.textColor,
             lineHeight: readerLineHeight(reader.textSize, reader.lineHeight),
             textAlign: reader.textAlign,
             paddingHorizontal: `${reader.padding}%`,
@@ -298,7 +298,7 @@ const Chapter = ({ route, navigation }) => {
                     style={[
                         styles.scrollPercentage,
                         {
-                            color: readerTextColor(reader.theme),
+                            color: reader.textColor,
                             backgroundColor: readerBackground(reader.theme),
                         },
                     ]}
diff --git a/src/Screens/Chapter/components/ReaderSheet.js b/src/Screens/Chapter/components/ReaderSheet.js
index fc3b6583..39edf6bd 100644
--- a/src/Screens/Chapter/components/ReaderSheet.js
+++ b/src/Screens/Chapter/components/ReaderSheet.js
@@ -29,6 +29,13 @@ const ReaderSheet = ({
         <Text style={styles.title}>{title}</Text>
     );
 
+    const textColor = {
+        1: "rgba(255,255,255,0.7)",
+        2: "#000000",
+        3: "#000000",
+        4: "#FFFFFF",
+    };
+
     return (
         <Bottomsheet
             ref={bottomSheetRef}
@@ -74,6 +81,12 @@ const ReaderSheet = ({
                                             value ?? reader.theme
                                         )
                                     );
+                                    dispatch(
+                                        setReaderSettings(
+                                            "textColor",
+                                            textColor[value] ?? reader.textColor
+                                        )
+                                    );
                                 }}
                                 value={reader.theme}
                             >
diff --git a/src/Screens/Chapter/readerStyleController.js b/src/Screens/Chapter/readerStyleController.js
index b4915a99..a3d58012 100644
--- a/src/Screens/Chapter/readerStyleController.js
+++ b/src/Screens/Chapter/readerStyleController.js
@@ -6,14 +6,14 @@ export const readerBackground = (val) => {
         4: "#444444",
     };
 
-    return backgroundColor[val] ?? "#FFFFFF";
+    return backgroundColor[val] ?? val;
 };
 
 export const readerTextColor = (val) => {
     const textColor =
         val === 1 ? "rgba(255,255,255,0.7)" : val === 4 ? "#FFFFFF" : "#000000";
 
-    return textColor;
+    return textColor ?? val;
 };
 
 export const readerLineHeight = (fontSize, lineHeightMultiplier) => {
diff --git a/src/Screens/More/GeneralSettings.js b/src/Screens/More/GeneralSettings.js
index b0f528df..7124d8a5 100644
--- a/src/Screens/More/GeneralSettings.js
+++ b/src/Screens/More/GeneralSettings.js
@@ -15,6 +15,7 @@ import DisplayModeModal from "./components/DisplayModeModal";
 import GridSizeModal from "./components/GridSizeModal";
 import ThemeModal from "./components/ThemeModal";
 import AccentColorModal from "./components/AccentColorModal";
+import { setAccentColor } from "../../redux/settings/settings.actions";
 
 const GenralSettings = ({ navigation }) => {
     const theme = useTheme();
@@ -120,6 +121,8 @@ const GenralSettings = ({ navigation }) => {
                 dispatch={dispatch}
                 accentColorModal={accentColorModal}
                 hideAccentColorModal={hideAccentColorModal}
+                color={theme.colorAccent}
+                onPress={(val) => dispatch(setAccentColor(val))}
                 theme={theme}
             />
         </ScreenContainer>
diff --git a/src/Screens/More/ReaderSettings.js b/src/Screens/More/ReaderSettings.js
index 7125b497..7615a3b2 100644
--- a/src/Screens/More/ReaderSettings.js
+++ b/src/Screens/More/ReaderSettings.js
@@ -1,18 +1,126 @@
-import React from "react";
+import React, { useState } from "react";
+import { Text, View } from "react-native";
 import { useDispatch } from "react-redux";
 
 import { Appbar } from "../../Components/Appbar";
 import { ScreenContainer } from "../../Components/Common";
+import { ListItem, ListSection, ListSubHeader } from "../../Components/List";
 
-import { useTheme } from "../../Hooks/reduxHooks";
+import { useReaderSettings, useTheme } from "../../Hooks/reduxHooks";
+import { setReaderSettings } from "../../redux/settings/settings.actions";
+import {
+    readerBackground,
+    readerLineHeight,
+    readerTextColor,
+} from "../Chapter/readerStyleController";
+import AccentColorModal from "./components/AccentColorModal";
 
 const ReaderSettings = ({ navigation }) => {
     const theme = useTheme();
     const dispatch = useDispatch();
 
+    const reader = useReaderSettings();
+
+    const textColor = {
+        1: "rgba(255,255,255,0.7)",
+        2: "#000000",
+        3: "#000000",
+        4: "#FFFFFF",
+    };
+
+    /**
+     * Reader Background Color Modal
+     */
+    const [readerBackgroundColorModal, setReaderBackgroundtColorModal] =
+        useState(false);
+    const showReaderBackgroundtColorModal = () =>
+        setReaderBackgroundtColorModal(true);
+    const hideReaderBackgroundtColorModal = () =>
+        setReaderBackgroundtColorModal(false);
+
+    /**
+     * Reader Text Color Modal
+     */
+    const [readerTextColorModal, setReaderTextColorModal] = useState(false);
+    const showReaderTextColorModal = () => setReaderTextColorModal(true);
+    const hideReaderTextColorModal = () => setReaderTextColorModal(false);
+
+    const setReaderBackground = (val) => {
+        dispatch(setReaderSettings("theme", val));
+    };
+
+    const setReaderTextColor = (val) => {
+        dispatch(setReaderSettings("textColor", val ?? reader.textColor));
+    };
+
+    const readerStyles = [
+        {
+            paddingVertical: 16,
+            paddingBottom: 32,
+            fontSize: reader.textSize,
+            color: reader.textColor,
+            lineHeight: readerLineHeight(reader.textSize, reader.lineHeight),
+            textAlign: reader.textAlign,
+            paddingHorizontal: `${reader.padding}%`,
+        },
+        reader.fontFamily && {
+            fontFamily: reader.fontFamily,
+        },
+    ];
+
     return (
         <ScreenContainer theme={theme}>
             <Appbar title="Reader" onBackAction={() => navigation.goBack()} />
+            <View style={{ backgroundColor: readerBackground(reader.theme) }}>
+                <Text style={readerStyles}>
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
+                    lobortis nunc id nisl tempor, sed tristique sem sagittis.
+                    Mauris consequat orci egestas volutpat vestibulum. Nullam
+                    convallis, leo in porttitor fringilla, ex mi finibus felis,
+                    non molestie ligula ligula facilisis ligula. Nam eu est a
+                    turpis porttitor aliquet sed vel risus. Ut ac scelerisque
+                    diam. Nulla fringilla enim non ex rhoncus faucibus. Integer
+                    eget lacus justo. Lorem ipsum dolor sit amet, consectetur
+                    adipiscing elit. Ut vitae tempor metus. Morbi nec nisl
+                    cursus, gravida ex vitae, laoreet leo. Pellentesque in
+                    lectus ante. Aliquam porta suscipit pretium. Sed ut ligula
+                    at dolor pretium egestas quis vitae urna. In ullamcorper
+                    venenatis orci, eu pulvinar nibh venenatis sit amet.
+                </Text>
+            </View>
+            <ListSection>
+                <ListSubHeader theme={theme}>Reader</ListSubHeader>
+                <ListItem
+                    title="Background Color"
+                    description={readerBackground(reader.theme)}
+                    onPress={showReaderBackgroundtColorModal}
+                    theme={theme}
+                    iconColor={readerBackground(reader.theme)}
+                    right="circle"
+                />
+                <ListItem
+                    title="Text Color"
+                    description={reader.textColor}
+                    onPress={showReaderTextColorModal}
+                    theme={theme}
+                    iconColor={reader.textColor}
+                    right="circle"
+                />
+            </ListSection>
+            <AccentColorModal
+                accentColorModal={readerBackgroundColorModal}
+                color={readerBackground(reader.theme)}
+                hideAccentColorModal={hideReaderBackgroundtColorModal}
+                theme={theme}
+                onPress={setReaderBackground}
+            />
+            <AccentColorModal
+                accentColorModal={readerTextColorModal}
+                color={reader.textColor}
+                hideAccentColorModal={hideReaderTextColorModal}
+                theme={theme}
+                onPress={setReaderTextColor}
+            />
         </ScreenContainer>
     );
 };
diff --git a/src/Screens/More/Settings.js b/src/Screens/More/Settings.js
index 02997386..d86855d3 100644
--- a/src/Screens/More/Settings.js
+++ b/src/Screens/More/Settings.js
@@ -43,7 +43,7 @@ const SettingsScreen = ({ navigation }) => {
                     }
                     theme={theme}
                 />
-                {/* <ListItem
+                <ListItem
                     title="Reader"
                     icon="book-open-outline"
                     onPress={() =>
@@ -52,7 +52,7 @@ const SettingsScreen = ({ navigation }) => {
                         })
                     }
                     theme={theme}
-                /> */}
+                />
                 <ListItem
                     title="Tracking"
                     icon="sync"
diff --git a/src/Screens/More/components/AccentColorModal.js b/src/Screens/More/components/AccentColorModal.js
index 03282314..921f612e 100644
--- a/src/Screens/More/components/AccentColorModal.js
+++ b/src/Screens/More/components/AccentColorModal.js
@@ -1,15 +1,15 @@
 import React, { useState } from "react";
 import { StyleSheet, Text } from "react-native";
 import { Modal, Portal, TextInput } from "react-native-paper";
-import { setAccentColor } from "../../../redux/settings/settings.actions";
 
 const AccentColorModal = ({
-    dispatch,
     accentColorModal,
     hideAccentColorModal,
     theme,
+    onPress,
+    color,
 }) => {
-    const [text, setText] = useState(theme.colorAccent);
+    const [text, setText] = useState(color);
     const [error, setError] = useState();
 
     return (
@@ -36,11 +36,11 @@ const AccentColorModal = ({
                 </Text>
                 <TextInput
                     value={text}
-                    defaultValue={theme.colorAccent}
+                    defaultValue={color}
                     onChangeText={(text) => setText(text)}
                     onSubmitEditing={() => {
                         if (text.match(/^#([0-9a-f]{6}|[0-9a-f]{3})$/i)) {
-                            dispatch(setAccentColor(text));
+                            onPress(text);
                             hideAccentColorModal();
                         } else {
                             setError("Enter a valid hex color code");
@@ -49,7 +49,7 @@ const AccentColorModal = ({
                     mode="outlined"
                     theme={{
                         colors: {
-                            primary: theme.colorAccent,
+                            primary: color,
                             placeholder: theme.textColorHint,
                             text: theme.textColorPrimary,
                             background: "transparent",
diff --git a/src/redux/settings/settings.reducer.js b/src/redux/settings/settings.reducer.js
index 7dc20203..b2e7d04a 100644
--- a/src/redux/settings/settings.reducer.js
+++ b/src/redux/settings/settings.reducer.js
@@ -45,6 +45,7 @@ const initialState = {
     novelsPerRow: 3,
     reader: {
         theme: 1,
+        textColor: "rgba(255,255,255,0.7)",
         textSize: 16,
         textAlign: "left",
         padding: 5,
@@ -82,6 +83,7 @@ const settingsReducer = (state = initialState, action) => {
                 [payload.key]: payload.val,
             };
         case SET_READER_SETTINGS:
+            console.log(payload.val);
             return {
                 ...state,
                 reader: {