diff --git a/frontend/src/LoginPage/LoginPage.jsx b/frontend/src/LoginPage/LoginPage.jsx
index 9ce1522a85..1d8a974e2b 100644
--- a/frontend/src/LoginPage/LoginPage.jsx
+++ b/frontend/src/LoginPage/LoginPage.jsx
@@ -15,6 +15,7 @@ class LoginPage extends React.Component {
 
     this.state = {
       isLoading: false,
+      showPassword: false,
     };
   }
 
@@ -22,6 +23,10 @@ class LoginPage extends React.Component {
     this.setState({ [event.target.name]: event.target.value });
   };
 
+  handleOnCheck = () => {
+    this.setState({ showPassword: !this.state.showPassword });
+  };
+
   authUser = (e) => {
     e.preventDefault();
 
@@ -85,7 +90,7 @@ class LoginPage extends React.Component {
                   <input
                     onChange={this.handleChange}
                     name="password"
-                    type="password"
+                    type={this.state.showPassword ?"text" : "password"}
                     className="form-control"
                     placeholder="Password"
                     autoComplete="off"
@@ -94,6 +99,21 @@ class LoginPage extends React.Component {
                   <span className="input-group-text"></span>
                 </div>
               </div>
+              <div class="form-check">
+                <input 
+                  type="checkbox" 
+                  class="form-check-input" 
+                  id="check-input"
+                  name="check-input"
+                  onChange = {this.handleOnCheck}
+                />
+                <label
+                  class="form-check-label" 
+                  for="check-input"
+                >
+                  show password
+                </label>
+              </div>
               <div className="form-footer">
                 <button
                   data-testid="loginButton"