Adobe XDを使っている人はダウンロードしておこう!Adobe公式、新しいセマンティックUIのコンポーネント
Post on:2019年6月12日
Adobe公式から新しいUIキットがリリースされています。
Semantic UIのフレームワークに基づいた80種類以上のコンポーネントが収録された素材で、HTMLやCSS、さらにはReactでデザインを実装することができます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061001-01.png)
The Semantic UI Kit for Adobe XD
Semantic UI Kitのダウンロード
Semantic UI KitはAdobe XD用のUI素材で、下記ページから無料でダウンロードできます。
![サイトのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061001-02.png)
Design Systems Semantic UI Kit for Adobe XD
Downloadはページの最下部。
個人でも商用のプロジェクトでも無料で利用できます。
Semantic UI Kitの中身
Semantic UI Kitの中身を見てましょう。
Adobe XDを持っていない人でも大丈夫。Adobeに登録していれば、Adobe XDは無料です。
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-01.png)
Semantic UI Kit
Semantic UI Kitには、Semantic UIのフレームワークに基づいた80種類以上のコンポーネントが収録されています。Webページやスマホアプリのプロトタイプ・モックアップの制作にすぐに利用できます。
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-02.png)
マスター コンポーネント
コンポーネントには今時のUI要素が揃っています。
その中からいくつか掲載します。
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-03.png)
カラー・タイポグラフィ
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-04.png)
アイコン
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-05.png)
カード
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-06.png)
メニュー
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-07.png)
レイアウト
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-08.png)
ボタン
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-09.png)
フォーム
![Semantic UI Kitのキャプチャ](http://coliss.com/wp-content/uploads-201903/2019061002-10.png)
セパレート
sponsors