Close

Signup Form

This an example of a signup form with a flipping animation, designed using CSS, HTML, JavaScript, and Bootstrap framework 4. The style sheet and the font styles have been imported to the code with their URLs. The JavaScript methods have been used to implement the flipping animation of the form, upon clicking on the 'Signup' button. The body of the form is given a font-family style as 'Dosis', sans-serif, and a background color as linear-gradient(left, #60a2dc 0%, #66c5db 50%, #60a2dc 100%). The signup container is given a width as 700px, background color as #FFF, and a box shadow style as 0px 0px 23px 2px rgba(0,0,0,0.3). The back side of the container is given a transform style as rotateY(180deg), to create the flipping animation. The input text field labels are given the styles of font color as #F87793, text-transform style as uppercase to automatically convert the text to uppercase, and height as 120px. The input test fields are given a font family style as 1.6em 'Dosis', sans-serif, and border bottom style as 1px solid #e6e6e6. The 'Signup' button has the styles of background color as linear-gradient(135deg, #f8759d 0%,#f7757c 100%), font color as #FFF, text-transform as uppercase, and font as 2em 'Dosis', sans-serif. Source: https://codepen.io/hecalu/pen/WQMoPM

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.