How to disable Google Chrome autofill option?


To disable autofill option specially on Google Chrome, use the autocomplete attribute and set it to −

autocomplete="chrome-off"

We will see an HTML form and for the fields we will disable the autofill, first for the form −

<form action="/action_page.php" method="get" autocomplete="chrome-off">
   <!- - -
   - ->
</form>

Now, disable the autofill for each input type −

<input type="text" name="firstname" placeholder="Enter First Name" autocomplete="chrome-off">
<input type="text" name="lastname" placeholder="Enter Last Name" autocomplete="chrome-off">
<input type="submit" value="SUBMIT" class="btn" autocomplete="chrome-off">

Example

Let us see an example −

<!DOCTYPE html>
<html>
<style>
   input {
      width: 315px;
      display: block;
      margin: 1rem auto;
      padding: 8px;
      border-radius: 20px;
      outline: none;
   }

   ::placeholder {
      color: #000;
   }

   .btn {
      background: black;
      border: none;
      height: 2rem;
      border-radius: 20px;
      width: 330px;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
   }
</style>
<body>
   <h1>Details</h1>
   <form action="/action_page.php" method="get"  autocomplete="chrome-off">
      <input type="text" name="firstname" placeholder="Enter First Name" autocomplete="chrome-off">
      <input type="text" name="lastname" placeholder="Enter Last Name" autocomplete="chrome-off">
      <input type="submit" value="SUBMIT" class="btn" autocomplete="chrome-off">
   </form>
</body>
</html>

Output

Enter some values above.

The above FirstName and LastName values won’t be visible the next time you fill the form, since we disabled autofill on Google Chrome above.

Updated on: 06-Dec-2022

4K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements