copy-figma-css: 便利なFigma CSSコピー拡張機能
copy-figma-cssは、FigmaからCSSを簡単にコピーするためのChrome拡張機能です。この拡張機能を有効にし、Figmaファイルでinspectタブをアクティブにすると、ユーザーは任意のノードを選択した後、設定したルールに従って自動的にCSSをコピーすることができます。
copy-figma-cssを使用すると、以下の機能を利用できます:
- Figma CSSの自動コピー
- 不要なコメントや不要なプロパティのフィルタリング
- 数値のスケールレベルとカスタム単位の設定
- 置換ルールのカスタマイズ
- CSS/LESS/SASS変数で値を置換
- 異なるプロジェクトごとの異なる設定
copy-figma-cssを使用するには、プラグインをインストールして拡張バーにピン留めするだけです。その後、Figmaファイルを開いたり更新したりし、"inspect"タブをアクティブにし、設定したルールに基づいてCSSをクリップボードに自動的にコピーする要素を選択します。CSSの手動コピーも拡張機能によって処理されます。
ブラウザがクリップボードの読み取り許可を求める場合は、「許可」をクリックしてアクセスを許可してください。拡張機能はCSSコードの読み取りのみ行います。
全体的に、copy-figma-cssはFigmaで作業するデザイナーや開発者にとって貴重なツールであり、CSSのコピーのプロセスを効率化し、生産性を向上させます。