sounansa.net

Bootstrapを使ったログイン画面の無料テンプレート 10選 

スポンサーリンク

WEBサービスを作るときにはどうしても必要になる管理画面ですが、あまり管理画面に手間をかけたくないのでBootstrapのようなデザインフレームワークを採用するすることも多いと思います。

レシポンシブな管理画面を作ったり、グリッドレイアウトにしたり、フォームまわりをこぎれいにするにはBootstrapは便利ですからね、やっぱり。

管理画面をBootstrapで作ったなら、フォームの統一感を考慮し、ログイン画面もBootstrapで作るのが普通かと思います。

でも、本家Bootstrapのサイトにあるサンプルのログインページでは物足りないと感じることも多いのではないでしょうか。

Bootstrapオフィシャルサイトのサンプルログインページ

bootstrap login

そこで、Bootstrapを使った無料のログインページテンプレートを集めてみました。

ログインページごときに手間をかけたくないので、コピペしてサクッと実装してみてはいかがでしょう。

Locked Login Page

ユーザーIDがロックされた状態のログインフォームのサンプルデザインです。ダークな色づかいにセンスを感じますね。
metronic

Red profile and login panel

赤が印象的なログインフォームです。
Red profile and login panel

login form layered

フォームの部分が重ねた紙を少しづつずらしたようなデザインです。シンプルですがちょっとしたアクセントをさりげなく使うだけでも十分おしゃれだと思います。
login form layered

Custom Login, Registration & Forgot Password

色が薄くて、ちょっとわかりにくいかもしれませんが、奇抜なデザインは好きです。ボタン部分の色をアレンジしてみるのも良いかも。
Custom Login, Registration & Forgot Password

Google style login extended

Googleのアカウントログインを模したデザインです。
Google style login extended

Simple login form – Bootsnipp style colorgraph

カラフルなラインをアクセントにしたデザインです。
Simple login form - Bootsnipp style colorgraph

Login Form Panel

タブ形式で切り替え可能なログインフォームです。けっこうタブを使うこのタイプって使ってみると便利だったりします。
Login Form Panel

Bond Street Login

テキストボックスを幅いっぱいにしたデザインです。
Bond Street Login

Login Form MD

フェイスブック認証、ツイッター認証のボタンがあるログインフォームです。
Login Form MD

Wedding login form

ウェディング系のサービスにどうぞ。ダウンロードするにはページ下部の真ん中あたりのダウンロードボタンからです。
Wedding login form

過去の記事でもログイン画面のHTMLテンプレートを紹介したページがありますので、よろしければそちらもご覧ください。

スポンサーリンク

comments powered by Disqus