Use autocomplete attribute on html inputs to improve form UX

8/21/2025

#html#frontend#ux

The autocomplete attribute helps browsers prefill form fields with stored data.
This makes forms faster to complete and reduces user frustration.

<form>
  <input type="email" name="email" autocomplete="email" placeholder="Email" />
  <input type="password" name="password" autocomplete="current-password" placeholder="Password" />
  <input type="text" name="name" autocomplete="name" placeholder="Full name" />
  <input type="tel" name="phone" autocomplete="tel" placeholder="Phone number" />
  <button type="submit">Sign in</button>
</form>

Some useful values:

  • email → suggests stored emails
  • current-password / new-password → helps with password managers
  • name, tel, address-line1, postal-code → autofill personal details

By using autocomplete properly, you reduce typing effort and give users a smoother experience.

Visit the MDN docs for more information and a list of all possible values.

New: Your Idea. Our Experts. We'll Build Your SaaS For You.

Our 'Done For You' service simplifies the process, taking your concept and delivering a production-ready MVP or complete SaaS solution.

Start your scalable and production-ready SaaS today

Save endless hours of development time and focus on what's important for your customers with our SaaS starter kits for Next.js, Nuxt 3 and SvelteKit

Get started

Stay up to date

Sign up for our newsletter and we will keep you updated on everything going on with supastarter.

    Use autocomplete attribute on html inputs to improve form UX | supastarter - SaaS starter kit for Next.js and Nuxt