Material design lite login page
home
Run
screen_rotation
fullscreen
cloud_download
navigate_next
<html> <head> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css"> <script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script> </head> <body> <div class="mdl-grid"> <div class="mdl-layout mdl-js-layout mdl-color--grey-100"> <main class="mdl-layout__content"> <div class="mdl-card mdl-shadow--6dp"> <div class="mdl-card__title mdl-color--primary mdl-color-text--white"> <h2 class="mdl-card__title-text">Login</h2> </div> <div class="mdl-card__supporting-text"> <form action="#"> <div class="mdl-textfield mdl-js-textfield"> <input class="mdl-textfield__input" type="text" id="email" /> <label class="mdl-textfield__label" for="email">Email</label> </div> <div class="mdl-textfield mdl-js-textfield"> <input class="mdl-textfield__input" type="password" id="userpass" /> <label class="mdl-textfield__label" for="userpass">Password</label> </div> </form> </div> <div class="mdl-card__actions mdl-card--border"> <button class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">Sign In </button> </div> </div> </main> </div> </body> </html>
<html> <head> <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> <link rel="stylesheet" href="https://code.getmdl.io/1.1.1/material.indigo-pink.min.css"> <script defer src="https://code.getmdl.io/1.1.1/material.min.js"></script> </head> <body> <div class="mdl-grid"> <div class="mdl-layout mdl-js-layout mdl-color--grey-100"> <main class="mdl-layout__content"> <div class="mdl-card mdl-shadow--6dp"> <div class="mdl-card__title mdl-color--primary mdl-color-text--white"> <h2 class="mdl-card__title-text">Login</h2> </div> <div class="mdl-card__supporting-text"> <form action="#"> <div class="mdl-textfield mdl-js-textfield"> <input class="mdl-textfield__input" type="text" id="email" /> <label class="mdl-textfield__label" for="email">Email</label> </div> <div class="mdl-textfield mdl-js-textfield"> <input class="mdl-textfield__input" type="password" id="userpass" /> <label class="mdl-textfield__label" for="userpass">Password</label> </div> </form> </div> <div class="mdl-card__actions mdl-card--border"> <button class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">Sign In </button> </div> </div> </main> </div> </body> </html>
Copyrights@tutorialsplane.com