What to Use Instead of Number Inputs

You might reach for when you’re, you know, trying to collect a number in a form. But it’s got all sorts of issues. For one, sometimes what you want kinda looks like a number, but isn’t one (like how a credit card number has spaces), because it’s really just a string of numbers. Even more importantly, there are a variety of screen reader problems.
Hanna Laakso documents the problems for GOV.UK. This is what they landed on:

The inputmode attribute is pretty great, and we have a deep dive on that.
Phil Nash came to (almost) same exact conclusion, and blogged about improving the experience of a two-factor auth code input on the Twilio blog:

That last attribute is interesting and new to me. It means you get this super extra useful experience on browsers that support it:

There are other autocomplete values, as Phil writes:
There are many autocomplete values available, covering everything from names and addresses to credit cards and other account details. For sign up and login there are a few autocomplete values that stand out as useful hints: username, email, new-password, current-password.Browsers and password managers have very good heuristics to find login forms on web pages, but using the username and current-password values make it very obvious.