ウェブ制作

Figmaでパスやテキストをアウトライン化する方法

Figmaでパスやテキストをアウトライン化する方法

ペンツールで描いた線、テキストツールで追加したテキスト、作成したオブジェクトなどを図形(閉じたパス)として扱うために必要なのが「アウトライン化」です。

Figmaでアウトライン化する方法

アウトライン化するには、オブジェクトを選択して右クリックで「Outline Stroke」という項目を選択すると、オブジェクトがアウトライン化されます。

Figmaで便利なアウトライン化のショートキー

  • Macの場合:⌘ + shift + o
  • Windowsの場合:ctrl + shift + o
  • Figmaでアウトライン化する方法

    アウトライン化されたオブジェクト

    左のレイヤーパネルを見ると、アウトライン化したテキストはテキストレイヤーからベクターレイヤーに変換され、Vector 3 (Stroke) はベクターレイヤーからシェイプレイヤーに変換されます。

    アウトライン化されたオブジェクト

    アウトライン化されたオブジェクトの編集

    アウトライン化することによって、他のオブジェクトとの結合に使用したり、文字エレメントの一部だけ色を変えたりすることができるようになります。テキストをアウトライン化した際は、文字のエレメントがすべて結合されています。そのため、一部の文字エレメントだけ色を変えたい場合は、該当のパスを結合から外す必要があります。

    アウトライン化されたオブジェクトの編集

    著者情報

    オーパスプラン編集部

    オーパスプラン編集メンバーが不定期で更新します。 ホームページ制作やウェブマーケティング、ウェブデザインに関する最新ニュースからノウハウまで、様々な情報を紹介していきます!

    ホームページ制作で悩んだら、

    まずはご相談を!

    ご相談・お見積り 資料ダウンロード