In this tutorial we're going to use the https://tailwindcss.com/ to build a login page for a new app. The final result for this login page is going to look like the image above. The starting HTML for this login page is the following.

As we want the login form to be in the center of the page we can set a container and then use flexbox to centralise the login form.

{{ csrf_field()}} https://paulund.co.uk/creating-a-login-page-with-tailwind-css#creating-quick-linksThe quick links section of the login page will allow your users to quickly go to a another page on the site that will be related to this page.
Newsletter

Get the latest Laravel/PHP jobs, events and curated articles straight to your inbox, once a week

Fathom Analytics | Fast, simple and privacy-focused website analytics. Fathom Analytics | Fast, simple and privacy-focused website analytics.
Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future. Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future.
Community Partners