Live demo — this example is server-driven; run the showcase locally for the interactive version.

Password generator

How to drop the password-generator widget into a real flow — inside a "create user" modal, or side-by-side with a live strength meter.

Examples

"Create user" modal with the password-generator widget inline.

With strength

Generator + a live strength indicator side by side.

✓ At least 8 characters
✓ Mixed case
✓ A digit
✓ A symbol

Usage

The widget is small enough to live anywhere — inside a modal, in a settings page, in a wizard step. Generate with crypto.getRandomValues client-side; never let the password touch the server before the user submits the form.

Password generator

Examples

In a modal

With strength

Usage