Passphrase generator

Four ordinary words are easier to remember and harder to crack than one word with punctuation stuffed into it.

correct-harbour-vessel-lantern

4

Strength

Strong

52 bits · centuries to crack offline

">

The prompt

Build a passphrase generator with Tailwind CSS. Use a max-w-lg card with a heading and a muted line explaining that four common words beat one mangled one. The output is a dark rounded-xl panel showing the generated phrase in large monospace with a regenerate button carrying a refresh glyph and a copy button. Under it, controls: a range slider for word count from three to eight with the value shown beside the label, and three toggle rows with small switches for adding a number, adding a separator symbol and capitalising each word. Then a strength block with a four-segment bar that fills according to the estimated entropy, a label reading the strength band, and a monospaced line giving the entropy in bits and an estimated offline cracking time. Then add JavaScript that builds the phrase from a small word list, recomputes entropy from the pool size and word count, updates the bar and wording, and copies with a confirmation.

Paste it into Claude, Cursor, v0 or any AI coding tool. Prefer the finished markup? .