動画で基礎を学ぶ!

会員限定 開発モードの活用

この学習動画は

会員限定!

月額¥11,000税込/月
今だけ30日間無料で使い放題!

会員登録はこちら
  • 開発モードとは
  • 開発モードの機能
  • Figma開発モードの使い方

開発モードとは

Figma開発モードとは、デザインの各要素をコードに変換し、開発者がそのコードを直接使用できる機能です。
具体的には、デザインプロパティ(色、フォント、間隔、サイズなど)をCSSやHTMLとしてエクスポートすることが可能です。

※Figma開発モードを使用される場合
無料の開発モードベータの提供は1月31日で終了し、使用には有料シートが必要となります。開発モードを使用されたい場合は、各自で有料シートへのアップグレードをお願いいたします。

開発モードの機能

Figma開発モードには多くの便利な機能があります。

  1. インスペクション機能
    デザインの各要素をクリックすることで、その要素のCSSプロパティや寸法を確認することができます。
  2. コードエクスポート機能
    デザイン要素を選択すると、その要素に対応するHTMLやCSSのコードを生成し、エクスポートすることができます。
  3. バージョン管理機能
    デザインの変更履歴を追跡し、必要に応じて以前のバージョンに戻すことができます。

この学習動画 / コンテンツの続きは

会員限定!

月額¥11,000税込/月
今だけ30日間無料で使い放題!

会員登録はこちら

パーツのコーディング

全 2 動画
  • 会員限定ボタンの作り方

    02:01
  • 会員限定開発モードの活用

    02:16