DEV Community

Discussion on: A pure CSS password generator! ๐Ÿ˜ฑ They said it can't be done...

Collapse
 
afif profile image
Temani Afif

I see the CSS syndrom affected you ๐Ÿ˜‹ .. pay attention you may loss you SVG skills if you continue this way ๐Ÿ˜

A small optimization using steps() jsfiddle.net/fvombg9y/1/

Collapse
 
grahamthedev profile image
GrahamTheDev

That is really strange, I tried with steps originally and things were ending up misaligned....maybe I was a dumb ass and put the wrong number in!

Collapse
 
afif profile image
Temani Afif

by the way, Alvaro wrote an article around random numbers on CSS: css-tricks.com/are-there-random-nu...

Thread Thread
 
grahamthedev profile image
GrahamTheDev • Edited

Interesting as I was looking for ways to do random and that article never came up, I guess that is a double shout out to Alvaro then! You were bound to have seen an article on this before....but I still haven't found a password generator with it (unless you are going to disappoint me!) ๐Ÿคฃ

Thread Thread
 
alvaromontoro profile image
Alvaro Montoro

Thank you for the shoutout :)

You can actually make the CSS password generator accessible by using a method similar to the article (instead of having the letters in the ::before, have them in the HTML and show/hide them). That way, users will be able to select them.

But remember: the passwords generated this way are not secure. They are only pseudo-random, so the password can be guessed/cracked knowing some factors.

Thread Thread
 
grahamthedev profile image
GrahamTheDev

Yeah I did think that after Temani pointed me to your article, but I couldnโ€™t work out a way of doing it that didnโ€™t require 620 elements.

I hope I covered the โ€œdonโ€™t use this in production it isnโ€™t actually randomโ€ clearly enough in the article but that is always the danger when you put code up, people just use it without thinking!