Green Colored Sign in Form with Avatar Icon
This is an example of a green colored sign in form with an avatar icon, designed using CSS, HTML, and Bootstrap framework 4. The avatar icon, font, and Bootstrap styles are imported to the code with the URLs. The body of the form is given the styles of font color as #4e4e4e, background color as #e2e2e2, and font-family style as 'Roboto', sans-serif. The form consists of the avatar icon, input text fields, and a 'Signin' button. The login card is given a width of 380px, background color of #fff, and a box-shadow style of 0px 2px 2px rgba(0, 0, 0, 0.3). The input text fields are given a background color of #f2f2f2, and a font-size of 16px. In the focus mode, the fields take the background color of #91d5a8, and a border color style of #e9f5ee. The login form title is displayed with a font-size of 34px. The avatar icon is given a background color of #4aba70, box-shadow style of 0px 2px 2px rgba(0, 0, 0, 0.1), height and a width of 100px, and the border –radius style as 50% to get the circle shape. The 'Signin' button is given a background color of #4aba70, which gets changed to #40aa65, in a hover event.