Bootstrap 4で実装されているデザインシステム要素すべてをデザイン素材にした無料素材 -Bootstrap Design System

Bootstrap 4で実装されているデザインシステム要素すべてをデザイン素材としてスケーラブルに再現したSketch用の無料素材を紹介します。

すべての要素はBootstrapで使用されている名前が適切に付けられているため、デザイナーとコーダー間のやり取りもスムーズにいくと思います。

サイトのキャプチャ

Bootstrap Design System

Bootstrap Design System

デザイン素材は、Sketch用のファイルです。

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材

各要素はカテゴリごとにまとめられています。

  • カラー
  • タイポグラフィ
  • ボタン・input要素
  • フォーム・ドロップダウン
  • アラート・モーダル・ツールチップ
  • ナビゲーション
  • バッジ・ラベル
  • アイコン
Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: カラー

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: タイポグラフィ

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: ボタン・input要素

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: フォーム・ドロップダウン

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: アラート・モーダル・ツールチップ

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: ナビゲーション

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: ナビゲーション

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: バッジ・ラベル

Bootstrap 4のデザイン素材

Bootstrap 4のデザイン素材: アイコン

Bootstrap 4のデザイン素材のダウンロード

ダウンロードは、下記ページから。

サイトのキャプチャ

Bootstrap Design System

「thorgate-bootstrap4-design-system.sketch」をクリックすると、すぐにダウンロードできます。ライセンスはCC BY-SA 4.0で、商用でもクライアントのプロジェクトでも無料で利用できます。再配布も可です。

sponsors

top of page

©2024 coliss