Close

Login, registration & recover password form

This is an example of login, registration, and a recover password form swap with a ripple effect and floating labels, designed using CSS, HTML, JavaScript, and Bootstrap framework 4. The form consists of three separate panels for login, registration, and recover password features. The body of the form is given a background color as #e0e0e0, and a font-family style as 'Roboto', Arial, sans-serif. The JavaScript methods have been used to implement the ripple swapping animation on the form. The sign-in form is given a background color as #00bcd4, whereas the register and recover password forms are given the colors #ffea00, and #757575 respectively. The title of the card is displayed with a font-size of 24px. The input text field labels are given a font-size as 16px, which gets changes to 12px, in a hover event to create the floating label effect. The input fields also take an underline effect with the color of #00bcd4, in a focus event. The buttons are given a text-transform style as uppercase to automatically convert the text to uppercase and a box-shadow style of 0 2px 2px 0 rgba(0, 0, 0, 0.12), to be activated on hover. Source:https://www.bootdey.com/snippets/view/user-profile-bio-graph-and-total-sales#css

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.