Lumeo

Password Input

A password field with built-in visibility toggle and optional strength meter — provides clear feedback as users create secure passwords.

Installation

dotnet add package Lumeo

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<PasswordInput />

When to Use

  • Login forms where users enter existing passwords
  • Registration flows where you want to show password strength feedback
  • Password change or reset screens
  • Any secure input that benefits from a show/hide visibility toggle

Try: "abc", "abc123", "Abc123!", "Abc123!@#xyz"

Show Strength:

Show Toggle:

Toggle the strength meter and visibility button on and off.

API Reference

PasswordInput

Density falls back to an ancestor DensityScope, then Comfortable. See the Density guide.

  • Input — Standard text input for non-sensitive fields
  • Form — Wrap PasswordInput with validation and labels in form layouts
  • OtpInput — Fixed-length code entry for 2FA and verification flows