WebサイトをFigmaにコピーするChrome拡張機能を使うには何が必要ですか？

Google Chromeで開いた公開ページまたはログイン中のWebページを用意してください。Weblifyでの最初のステップ：コピーしたいWebサイトをChromeで開く。

WebサイトをFigmaにコピーするChrome拡張機能で何ができあがりますか？

最終的にFigmaに貼り付けられた編集可能なWebレイヤーができあがります。最後のステップ：新規または既存のFigmaファイルに貼り付ける。

アップグレードする前にWebサイトをFigmaにコピーするChrome拡張機能を試せますか？

はい。WeblifyにはProの無料トライアルが25回付いています。クレジットカードは不要で、トライアル後も無料の機能を引き続き使えます。

Weblifyの機能

無料のChrome拡張機能で、どんなWebサイトもFigmaにコピー。

Weblifyの無料拡張機能を使えば、Chromeでページ全体をコピーしたり要素を1つだけ選んだりして、編集可能なレイヤーとしてFigmaに貼り付けられます。

無料のChrome拡張機能を入手
WebサイトをFigmaに直接コピー

インストールセキュリティ機能ガイド

Chrome Web Storeから無料でインストールでき、クレジットカードは不要です。

Thanks so much, Adam!... saved me many, many hours of manual work.

世界トップクラスの企業のチームが利用しています

ChromeからFigmaへ

ページをコピーして、
レイヤーはそのまま。

Chromeでページ全体またはひとつの要素を選んでクリップボードにコピーし、その結果をFigmaに貼り付けられます。

Weblifyを試してみませんか？ まずは25回の無料Proトライアルから。クレジットカードは不要です。 Weblifyを無料で試す → 料金を見る

実際の使い方

WebサイトをFigmaにコピーするChrome拡張機能を、
いまのワークフローに。

全体の構造が必要なときはページ全体をコピーし、特定のリファレンスだけが必要なときは要素を1つ選択できます。

Weblify Pro

手作業で作り直さずに、WebサイトをFigmaへ。

WeblifyのChrome拡張機能が現在のブラウザセッションでページを読み取り、選択した内容をクリップボードにコピーするので、編集可能なレイヤーとしてFigmaに貼り付けられます。

機能ガイドを読む

準備するもの: Google Chromeで開いた公開ページまたはログイン中のWebページ
仕上がり: Figmaに貼り付けられた編集可能なWebレイヤー
こんな用途に: 編集可能なWebのリファレンスをFigma内で使いたいデザイナー
利用できるプラン: Google Chrome向けの無料Weblify拡張機能

よくある質問

始める前に知っておきたいこと。

必要なもの、WebサイトをFigmaにコピーするChrome拡張機能で作れるもの、試す方法をまとめました。

Google Chrome、無料のWeblify拡張機能、コピーしたレイヤーを貼り付けるFigmaファイルが必要です。まずGoogle Chromeで開いた公開ページまたはログイン中のWebページを用意してください。

仕上がりはFigmaに貼り付けられた編集可能なWebレイヤーです。最後のステップ：新規または既存のFigmaファイルに貼り付ける.

はい。拡張機能は無料です。Chrome Web Storeからインストールすれば、クレジットカードなしでWebサイトをFigmaにコピーできます。