diff --git a/frontend/public/index.html b/frontend/public/index.html
index b0c7dbe75d03e74c636d068b3822cc01bed2b3f3..bacd358a997c085d5a1bfb6f59ea28c4b95d52bc 100644
--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@@ -40,6 +40,12 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
 		-->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/holder/2.9.7/holder.js"></script>
+    <script>
+			/* functions to set user settings in console*/
+			function setInterfaceSize(size) {
+				document.documentElement.style.fontSize = `${size}%`;
+				localStorage.setItem("interfaceSize", size);
+			}
+		</script>
   </body>
 </html>
diff --git a/frontend/src/components/App.tsx b/frontend/src/components/App.tsx
index 96a3bc2598416efe6fe78c2ab91f72f3ac9cb51b..781725d8e49de373de8d35266c4f89f08caf2b93 100644
--- a/frontend/src/components/App.tsx
+++ b/frontend/src/components/App.tsx
@@ -19,7 +19,14 @@ class App extends React.Component<{}, AppState> {
   constructor(props: {}) {
     super(props);
     this.state = { toggledLeft: false, toggledRight: false };
-  }
+	}
+	
+	componentDidMount(){
+		let interfaceSize = localStorage.getItem("interfaceSize");
+		if (interfaceSize){
+			document.documentElement.style.fontSize = `${interfaceSize}%`;
+		}
+	}
 
   toggleLeftBar() {
     this.setState((state) => ({