bootstrap PR

bootstrap admin themeの使い方とテンプレートおすすめ36選!

記事内に商品プロモーションを含む場合があります
✓本記事のテーマ
  • bootstrap admin themeとは?
  • どんな人にオススメなのか
  • 無料の管理画面・ダッシュボード24選
  • 有料の管理画面・ダッシュボード12選

今回は上記のテーマで解説していきます。

細かいところについて詳しく解説していきますので、是非参考にして頂ければと思います。

Table of Contents

〔bootstrap admin theme 使い方〕bootstrap admin themeとは?

bootstrap admin themeは「bootstrap」を使用して作られた管理画面のことです。

エンドユーザーが見るフロントエンドの機能を管理する役目を持っています。

有料から無料のものまで様々なテンプレートが配布されています。

〔bootstrap admin theme 使い方〕どんな人にオススメなのか

  • 「管理画面を0から作るのは難しい」
  • 「使い勝手の良い管理画面が欲しい」
  • 「デザインの優れた管理画面が欲しい」

という方にオススメです。

〔bootstrap admin theme 使い方〕どのように選べばいいのか?

無料のものは、クレジット表記が必須であったり、1つのサイトにしか適応できないなどの制限が設けられていることがあるので、自由に、無制限に使いたいという方は有料版を購入することをオススメします。

もちろん無料でも機能制限のないものもいくかあるので、各公式サイトでチェックしてみることもオススメします。

〔bootstrap admin theme 使い方〕無料の管理画面・ダッシュボード24選

1.Dashboard

bootstrap公式が配布している管理ツールです。

https://cccabinet.jpn.org/bootstrap4/sample/dashboard

2.Paper Dashboard

https://www.creative-tim.com/product/paper-dashboard-react

3.Argon Dashboard

https://www.creative-tim.com/product/argon-dashboard

4.Klorofil Free Clean Bootstrap Admin Template

https://www.themeineed.com/downloads/klorofil-free-bootstrap-admin-template/

5.Lumino Free Bootstrap Admin Template

https://medialoot.com/item/lumino-admin-bootstrap-template/

6.Bootstrap 3 Free Admin Theme

※こちらはBootstrap 3を基盤に作成されているのでBootstrap 4では正しく動作しない可能性があります。

https://github.com/VinceG/Bootstrap-Admin-Theme

7.AdminLTE – Free Bootstrap 3 Admin Template

https://adminlte.io/

8.Hierapolis – Bootstrap 3 Based Flat Style Admin Template

※こちらはBootstrap 3を基盤に作成されているのでBootstrap 4では正しく動作しない可能性があります。

https://github.com/lab2023/hierapolis

9.Charisma

https://github.com/usmanhalalit/charisma

10.Light Bootstrap Dashboard Template

https://github.com/creativetimofficial/light-bootstrap-dashboard

11.Gentelella – Free Bootstrap 3 Admin Template

※こちらはBootstrap 3を基盤に作成されているのでBootstrap 4では正しく動作しない可能性があります。

https://github.com/ColorlibHQ/gentelella

12.Clean Dashboard Responsive Bootstrap UI Theme

https://github.com/keaplogik/Bootstrap-Clean-Dashboard-Theme

13.TemplateVamp – Free Bootstrap Admin Template

https://github.com/natm/templatevamp-flask

14.SB Admin 2 – The Original Free Bootstrap Admin Theme

https://github.com/puikinsh/Bootstrap-Admin-Template

15.RDash Angular – Bootstrap AngularJS Admin Dashboard

https://github.com/invertase/rdash-angular

16.Blocks Single Page Bootstrap Admin Theme

http://www.prepbootstrap.com/bootstrap-theme/single-page-admin

17.Paper Dashboard – Free Bootstrap Admin Template

https://www.creative-tim.com/product/paper-dashboard

18.Startmin – Open Source Admin Dashboard Template for Bootstrap

https://github.com/secondtruth/startmin

19.Bootflat Admin – Flat UI Bootstrap 3 Admin Dashboard

※こちらはBootstrap 3を基盤に作成されているのでBootstrap 4では正しく動作しない可能性があります。

https://github.com/silverbux/bootflat-admin

20.CoreUI Bootstrap Admin Template

https://coreui.io/index.html

21.Vue Material Design Bootstrap 4 Admin UI Kit

https://mdbootstrap.com/docs/vue/

22.Material Dashboard Free Bootstrap 4 Admin Template

https://www.creative-tim.com/product/material-dashboard

23.Adminator Bootstrap 4 Admin Dashboard Template

https://github.com/puikinsh/Adminator-admin-dashboard

24.Now UI Free Bootstrap 4 Dashboard Template

https://www.creative-tim.com/product/now-ui-dashboard

〔bootstrap admin theme 使い方〕有料の管理画面・ダッシュボード12選

以下は、すべてEvanto Elementsに有料会員登録することでダウンロード可能です。

1.Admin Press

https://elements.envato.com/admin-press-angular-7-dashboard-template-2DLXE9?clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-3T0DUp-x80&iradid=298927&iradtype=ONLINE_TRACKING_LINK&irgwc=1&irmptype=mediapartner&mp=Speckyboy%20Design%20Magazine&utm_campaign=elements_af_78798&utm_medium=affiliate&utm_source=impact_radius

2.Starlight

https://elements.envato.com/starlight-responsive-bootstrap-4-admin-template-E9R6DQ?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-3Q8DUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

3.Paper Panel

https://elements.envato.com/paper-panel-bootstrap-4-admin-dashboard-template-EXXPRF?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-3X0DUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

4.Kode

https://themeforest.net/item/kode-responsive-admin-dashboard-template/10814250

5.Kenny

https://elements.envato.com/kenny-dashboard-admin-site-responsive-template-6DSR6V?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-yUkDUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

6.Premier Material 2

https://elements.envato.com/primer-material-2-angular-6-admin-template-H2WBXP?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-yRUDUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

7.Adminto

https://elements.envato.com/adminto-admin-dashboard-angular-react-vuejs-E85H4R?clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-yWQDUp-x80&iradid=298927&iradtype=ONLINE_TRACKING_LINK&irgwc=1&irmptype=mediapartner&mp=Speckyboy%20Design%20Magazine&utm_campaign=elements_af_78798&utm_medium=affiliate&utm_source=impact_radius

8.Bracket

https://elements.envato.com/bracket-responsive-bootstrap-admin-template-QHCFTF?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-yW4DUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

9.Space

https://elements.envato.com/space-responsive-admin-dashboard-template-A9REUB?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-yTYDUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

10.Flatkit

https://elements.envato.com/flatkit-dashboard-ui-kit-FLRDLJ?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-R3UDUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

11.Chain

https://elements.envato.com/chain-responsive-bootstrap-admin-template-7YWBV9?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-RyADUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

12.Admin.io

https://elements.envato.com/admin-io-GG5ENR?irgwc=1&clickid=R5mU4NRYvxyOWKRwUx0Mo3w3Ukiw-RUADUp-x80&iradid=298927&utm_campaign=elements_af_78798&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&utm_medium=affiliate&utm_source=impact_radius&mp=Speckyboy%20Design%20Magazine

〔bootstrap admin theme 使い方〕まとめ

今回紹介したテンプレートは全てがレスポンシブデザインに対応しているので、スマホなどの端末から見ても同じように使用できます。

無料のものの中にはライセンス表記が必要なものもございますので各公式ページから確認してください。