VSCodeにFigmaを組み込む「Figma for VS Code」登場 コードの自動補完にも対応
米FigmaがVSCodeのコードエディタ画面にFigmaの機能を組み込む「Figma for VS Code」を発表。すでにプラグインとして公開している。
この記事は新野淳一氏のブログ「Publickey」に掲載された「VSCodeにFigmaを組み込む「Figma for VS Code」登場。コードの自動補完にも対応」(2023年6月26日掲載)を、ITmedia NEWS編集部で一部編集し、転載したものです。
2022年、米Adobeによる買収が発表され話題となったWebデザインツールを提供する米Figmaは6月23日と24日の2日間、イベント「Config 2023」をサンフランシスコで開催しました。
その基調講演で、VSCodeのコードエディタ画面にFigmaの機能を組み込む「Figma for VS Code」が発表されました。
Figma for VS CodeはVSCodeのプラグインとして提供されます。
基調講演のデモでは、下図のようにVSCodeのコードエディタ画面と並んで右側にFigmaのキャンバス画面が表示されました。
CSSのプロパティやボックスモデルなども右下のペインのように表示されます。
コードエディタでCSSの入力を始めると、Figma側のレイヤ名が自動的に補完されてクラス名が入力されるだけでなく、CSSの中身も自動的に補完入力される様子が示されました。
すでにプラグインは公開されています。
プラグインのページでは、Figmaの通知がVSCodeでも行われることが示されています。
VSCode以外にもFigmaは「Dev Mode」として、さまざまな開発者向けツールとの連携を発表し、デザインツールのFigmaと開発者との連携を強めていくことを明らかにしました。
関連記事
- 犬猫ずらっと! Figma公式サイトの「従業員のペット紹介ページ」が話題 誕生の背景には独自の社内制度
デザインツール「Figma」公式サイト掲載の“従業員のペット紹介ページ”が話題に。Figma社によれば、誕生の背景には独自の社内制度があったという。 - 「Figma」日本語版が公開 デザインコラボツール大手 ヤフー、LINE、楽天などがすでに導入
米Figmaが、デザインコラボレーションツール「Figma」の日本語版を提供開始した。デザイナーだけでなく、エンジニア、マーケター、コピーライターなどが参加して一緒にデザインを作り上げる、チームでのデザイン制作を支援する。 - 公取委、AdobeのFigma買収について意見募集 どんな影響があるか情報求める
公正取引委員会が、米Adobeと米Figmaの統合について意見募集を始めた。映像制作ツールの開発販売を手掛けるAdobeとデザインツールを提供するFigmaの統合が日本における競争にどのような影響を与えるか、情報や意見を求める。 - Adobe、Figmaを約2.9兆円で買収へ デザインコラボツール大手
米Adobeは9月15日(現地時間)、デザインコラボレーションツール大手のFigmaを200億ドル(約2.9兆円)で買収したと発表した。2023年内に買収を完了する予定としている。 - Figma Japan責任者に聞く、これからのユーザーコミュニティー戦略 日本展開から1年、今後の戦い方は
日本展開のスタートから1年が経過したFigma。国内展開を加速する中、ユーザーコミュニティーも重要視していくという。今後の方針を日本法人の責任者に聞いた。
関連リンク
Copyright © ITmedia, Inc. All Rights Reserved.