Neumorphism UI - Неоморфизм / Дизайн / Плагины Bootstrap

Версия: v4.3.1

Каталог: Плагины Bootstrap

Категория: Дизайн

Bootstrap: 4

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop, Shopify, WHMCS, PHP

Язык: Английский

Вес файла: 3.68 Mb

Уникальный ID: 5704

Посмотрели: 1064 раз

Скачать бесплатно

Помощь: установка & настройка

Скачали бесплатно: 92 раз

Прокомментировали: 0 раз

Рейтинг: 3.7 / 5 - 6 голосов

Тип лицензии: CC BY 4.0

Авторство: https://github.com/themesberg/neumorphism-ui-bootstrap

Информация: Пользователям

Информация: Правообладателям

Теги: Plugin, неоморфизм, neumorphism, bootstrap 4

Поделился: BootstrapТема

Добавлено: 2023-02-03 в 09:09

Метка: 1675404583

⇄ ⇅

<div class="section section-lg pt-0">
 <div class="container">
 <div class="row">
 <div class="col text-center">
 <h2 class="h5 mb-7">Login & Register</h2>
 </div>
 </div>
 <div class="row justify-content-md-around">
 <div class="col-12 col-md-6 col-lg-5 mb-5 mb-lg-0">
 <div class="card bg-primary shadow-soft border-light p-4">
 <div class="card-header text-center pb-0">
 <h2 class="h4">Sign in to our platform</h2><span>Login here using your username and password</span>
 </div>
 <div class="card-body">
 <form action="#" class="mt-4">
 <div class="form-group"><label for="exampleInputIcon333">Your email</label>
 <div class="input-group mb-4">
 <div class="input-group-prepend"><span class="input-group-text"><span class="fas fa-envelope"></span></span></div><input class="form-control" id="exampleInputIcon333" placeholder="example@company.com" type="text" aria-label="email adress">
 </div>
 </div>
 <div class="form-group">
 <div class="form-group"><label for="exampleInputPassword777">Password</label>
 <div class="input-group mb-4">
 <div class="input-group-prepend"><span class="input-group-text"><span class="fas fa-unlock-alt"></span></span></div><input class="form-control" id="exampleInputPassword777" placeholder="Password" type="password" aria-label="Password" required>
 </div>
 </div>
 <div class="d-block d-sm-flex justify-content-between align-items-center mb-4">
 <div class="form-check"><input class="form-check-input" type="checkbox" value="" id="defaultCheck545"> <label class="form-check-label" for="defaultCheck545">Remember me</label></div>
 <div><a href="#" class="small text-right">Lost password?</a></div>
 </div>
 </div><button type="submit" class="btn btn-block btn-primary">Sign in</button>
 </form>
 <div class="mt-3 mb-4 text-center"><span class="font-weight-normal">or login with</span></div>
 <div class="btn-wrapper my-4 text-center"><button class="btn btn-primary btn-pill btn-icon-only text-facebook mr-2" type="button" aria-label="facebook button" title="facebook button"><span aria-hidden="true" class="fab fa-facebook-f"></span></button> <button class="btn btn-primary btn-pill btn-icon-only text-twitter mr-2" type="button" aria-label="twitter button" title="twitter button"><span aria-hidden="true" class="fab fa-twitter"></span></button> <button class="btn btn-primary btn-pill btn-icon-only text-facebook" type="button" aria-label="github button" title="github button"><span aria-hidden="true" class="fab fa-github"></span></button></div>
 <div class="d-block d-sm-flex justify-content-center align-items-center mt-4"><span class="font-weight-normal">Not registered? <a href="#" class="font-weight-bold">Create account</a></span></div>
 </div>
 </div>
 </div>
 <div class="col-12 col-md-6 col-lg-5 mb-5 mb-lg-0">
 <div class="card bg-primary shadow-soft border-light p-4">
 <div class="card-header text-center pb-0">
 <h2 class="mb-0 h5">Create Account</h2>
 </div>
 <div class="card-body">
 <form action="#">
 <div class="form-group"><label for="exampleInputIcon999">Your email</label>
 <div class="input-group mb-4">
 <div class="input-group-prepend"><span class="input-group-text"><span class="fas fa-envelope"></span></span></div><input class="form-control" id="exampleInputIcon999" placeholder="example@company.com" type="text" aria-label="email adress">
 </div>
 </div>
 <div class="form-group">
 <div class="form-group"><label for="exampleInputPassword345">Password</label>
 <div class="input-group mb-4">
 <div class="input-group-prepend"><span class="input-group-text"><span class="fas fa-unlock-alt"></span></span></div><input class="form-control" id="exampleInputPassword345" placeholder="Password" type="password" aria-label="Password" required>
 </div>
 </div>
 <div class="form-group"><label for="exampleConfirmPassword712">Confirm Password</label>
 <div class="input-group">
 <div class="input-group-prepend"><span class="input-group-text"><span class="fas fa-unlock-alt"></span></span></div><input class="form-control" id="exampleConfirmPassword712" placeholder="Confirm password" type="password" aria-label="Password" required>
 </div>
 </div>
 <div class="form-check mb-4"><input class="form-check-input" type="checkbox" value="" id="defaultCheck634"> <label class="form-check-label" for="defaultCheck634">I agree to the <a href="#">terms and conditions</a></label></div>
 </div><button type="submit" class="btn btn-block btn-primary">Sign in</button>
 </form>
 <div class="mt-3 mb-4 text-center"><span class="font-weight-normal">or</span></div>
 <div class="btn-wrapper my-4 text-center"><button class="btn btn-primary btn-pill btn-icon-only text-facebook mr-2" type="button" aria-label="facebook button" title="facebook button"><span aria-hidden="true" class="fab fa-facebook-f"></span></button> <button class="btn btn-primary btn-pill btn-icon-only text-twitter mr-2" type="button" aria-label="twitter button" title="twitter button"><span aria-hidden="true" class="fab fa-twitter"></span></button> <button class="btn btn-primary btn-pill btn-icon-only text-facebook" type="button" aria-label="github button" title="github button"><span aria-hidden="true" class="fab fa-github"></span></button></div>
 <div class="d-block d-sm-flex justify-content-center align-items-center mt-4"><span class="font-weight-normal">Already have an account? <a href="#" class="font-weight-bold">Login here</a></span></div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>

BootstrapTema

Neumorphism UI - Неоморфизм

Скриншот

Подробнее

Похожие материалы

Просмотренные материалы

Всего комментариев: 0