Why this works

Allowing users to toggle password visibility improves usability, especially on mobile devices. The interactive eye icon enhances the experience without heavy libraries.

Source Code

<div style="position:relative;">
  <input type="password" id="passwordInput" placeholder="Enter Password" style="width:100%;padding:0.75rem 2.5rem 0.75rem 1rem;border-radius:8px;border:1px solid #ced4da;">
  <span onclick="togglePassword()" style="position:absolute;top:50%;right:1rem;transform:translateY(-50%);cursor:pointer;font-size:1.2rem;">👁</span>
</div>

<script>
function togglePassword() {
  const input = document.getElementById('passwordInput');
  if (input.type === 'password') {
    input.type = 'text';
  } else {
    input.type = 'password';
  }
}
<\/script>