Login Page V07

Author: Colorlib

Released: September 2026

License: CC BY 3.0

A native-app style sign-in for a made-up running app, shown inside a phone frame on desktop and full screen on real phones. A coral header with a route line and run stats sits above a white bottom sheet with large 58 px fields, a stay-logged-in switch and big buttons. The Use Face ID button is clearly marked as a demo and only plays a short simulated scan.

It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 205 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.

• Phone frame, status bar and home bar drop away below 480 px
• Touch targets of 48–58 px throughout
• Stay-logged-in switch built on a checkbox with role switch
• Simulated Face ID scan, labelled Demo, with a reduced-motion shortcut
• inputmode email, autocapitalize off and current-password autocomplete
• Errors after interaction, read out in a polite status region