BulmaのUIキット作りました!
BulmaのUIキットです。無料ですのでお使いください!
Bulma好きが高じて、BulmaのパーツやコンポーネントなどのUI一式をまとめたAdobe XDファイル作ってしまいました(笑)。
せっかくですので、無料配布します。使ってみたい方はぜひダウンロードしてください。
BulmaのUIを一通り網羅していますので、これであらかたのデザインは作れると思います。

▲AdobeXDでBulmaのUIキットの外観
下記のボタンからファイルをダウンロードできます。
※ダウンロード前に下記の注意事項をお読みください。
注意事項
- みなさまが当Adobe XDファイルをダウンロードし、使用することによって、コンピュータやソフト、または業務に支障・障害が生じた場合、いかなる理由によるものでも一切責任を負いません。あらかじめご了承ください。
- 当データは、Adobe XDのバージョン(8.1.22.2)で作られています。バージョンによってデザインが崩れたり、意図しない動作が発生する可能性があります。
- 利用制限は特にございません。商用でも無料でご利用いただけます。
ファイルの解説
解説するほどでもありませんが、ファイルの中身をさらっと紹介します。
Colors
よく使う「is-info」や「is-success」などの色をまとめています。
スポイトで色を拾ってお使いください。

Bulmaでよく使う色をまとめています。
Layout
footerやhero、Media ObjectなどのBulmaのLayoutもまとめています。
そのままコピーして文字と色のみ変更すれば、すぐにレイアウトを作る事ができますよ。

Bulmaのfooterやheroもまとめています。
Form
Bulmaのフォーム一式をまとめています。inputからselect、uploadまでそろえています。
これでフォームは簡単に作れることでしょう。

Bulmaのフォームもそろえました!
Elements
「ボタン」や「タグ」、「テーブル」などのBulmaのエレメンツをまとめています。

Bulmaのエレメンツ群です。
Components
サイト製作時によく使う「パンくず」や「ページネーション」、「タブ」などのコンポーネントです。

「パンくず」や「タブ」、「カード」などがすぐに使えます。
まとめ
以上、BulmaのUIキットでした。
使ってみたいという方がいましたら、ぜひお試しを!
BulmaのUIキットについて「ここが間違っているよ。こうした方がいいよ。」といったご意見がありましたら、お問い合わせにてご連絡ください。なるべく早く返信するよう心がけますので、よろしくお願いします。