個人でアプリ開発をしていたときに、
「CSSフレームワークってどれがいいんだ? とりあえず、Bootstrapを使っておけばいいのか?」
と思って調べたときに作成した一覧を公開します。
調査・検討する際の補助資料として使っていただければと思います。
自分で使ったり、ドキュメントを読み込んだりした訳ではないですし、全てを網羅している訳ではないので、その点はご承知おきください。
対象読者
- どのフレームワークを使おうか迷っている
- そもそもどんなフレームワークがあるのだろう?という方
CSS フレームワーク一覧
CSS フレームワーク |
GitHub Star |
GitHub Link |
Document |
Bootstrap |
129,058 |
https://github.com/twbs/bootstrap |
https://getbootstrap.com/ |
Semantic UI |
43,632 |
https://github.com/Semantic-Org/Semantic-UI |
https://semantic-ui.com/ |
Materialize |
34,521 |
https://github.com/Dogfalo/materialize |
https://materializecss.com/ |
Bulma |
31,510 |
https://github.com/jgthms/bulma |
https://bulma.io/documentation/overview/start/ |
Foundation |
27,828 |
https://github.com/zurb/foundation-sites |
https://foundation.zurb.com/ |
Pure |
19,347 |
https://github.com/pure-css/pure |
https://purecss.io/ |
Skeleton |
16,248 |
https://github.com/dhg/Skeleton |
http://getskeleton.com/ |
UIkit |
13,513 |
https://github.com/uikit/uikit |
https://getuikit.com/ |
mini.css |
2,484 |
https://github.com/Chalarangelo/mini.css |
https://minicss.org/docs |
Micron.JS |
1,944 |
https://github.com/webkul/micron |
https://webkul.github.io/micron/docs.html |
PROPELLER |
1,141 |
https://github.com/digicorp/propeller |
https://propeller.in/ |
SkyBlue |
452 |
https://github.com/Stanko/skyblue |
http://stanko.github.io/skyblue/ |
所感
CSSについてそこまで詳しくない自分は一旦Bootstrapを使おうと思います。
「Star数が多い = 情報が豊富」なので嵌った際の解決法がネット上で得られる可能性が高いからです。
(Bootstrapの利用者が多いとは思っていましたが、ここまで差があるとは想像していませんでした。)
また、「CSS フレームワーク」で検索すると上位に出てくるCSSフレームワーク(記事)は玉石混交だなと感じました。
調べている時間は有限な開発リソースを削っていることになるので、情報の取捨選択を上手に行っていきたいと思った所存です。