Update v4.2 - New components, 10+ framework guides, and quality improvements. Visit Changelog

Tailwind CSS Toggle Password

The Toggle Password Component is an intuitive feature commonly incorporated into login and registration forms. It allows users to switch between showing and hiding their password inputs. This functionality provides users with the flexibility to ensure their password entries are accurate while maintaining the confidentiality of their sensitive information.

Requires JS

Note that this component requires the use of our Toggle Password plugin, else you can skip this message if you are already using Preline UI as a package.

Password field with toggle

Add a button inside the input to show or hide the password value.

Checkbox-controlled toggle

Use a checkbox to switch password visibility on and off.

Synchronized password fields

Control multiple password inputs at the same time with a shared toggle target list.

Use the toggle password component inside modal content.

Destroy and reinitialize

Use the destroy method before reinitializing the component when the toggle-password field needs to be rebuilt.

© 2026 Preline Labs.