MENU
カテゴリー

Figmaで画像やオブジェクトをぼかす方法!

Figmaで画像やオブジェクトをぼかす方法!

※当ブログでは商品・サービスのリンク先にプロモーションを含みます。ご了承ください。

この記事では「Figmaで画像やオブジェクトを全体的にぼかす方法」と「部分的にぼかす方法」の2つの内容を紹介します。

目次

Figmaで画像やオブジェクトを全体的にぼかす

始めに画像やオブジェクトを全体的にぼかす方法の紹介です。

全体的にぼかす手順は下記の通りです。

Figmaで画像を全体的にぼかす手順
  1. 「レイヤーブラー」を選択する
  2. ぼかし具合を調整する

「レイヤーブラー」を選択する

Figmaのぼかし機能である「レイヤーブラー」を選択します。

ぼかしたい画像を選択した状態でエフェクトの「+」を選択し、プルダウンの中から「レイヤーブラー」を選択します。

ぼかし具合を調整する

続いてぼかしの具合を調整します。

「エフェクトの設定」から「ぼかし範囲」の数字を調整します。

するとぼかし具合が調整されます。

ちなみに画像以外にオブジェクトやテキストも同様にぼかすことが出来ます。

あわせて読みたい
Photoshopで写真をぼかす方法を紹介! ​Photoshopの「ぼかし」機能は、画像編集において非常に重要な役割を果たします。 ​画像全体や一部をぼかすことで、被写体を際立たせたり、情報を隠したり、背景と被写...

画像やオブジェクトを部分的にぼかす方法

次は部分的にぼかす方法を紹介します。

Figmaで画像を部分的にぼかす手順
  1. オブジェクトを作る
  2. オブジェクトに「背景のぼかし」を設定する
  3. ぼかし具合を調整する

オブジェクトを作る

始めにぼかしたい形のオブジェクトを作成します。

今回は長方形を作成します。

この際オブジェクトの色は「白」で透明度は「1%」に設定しておきます。

オブジェクトに「背景のぼかし」を設定する

続いてオブジェクトに「背景のぼかし」を設定します。

「エフェクト」→「背景のぼかし」を選択します。

ぼかし具合を調整する

最後にぼかし具合を調整します。

するとオブジェクトが配置されている箇所だけ部分的にぼかしが効きます。

画像の背景だけをぼかす方法

画像の背景だけをぼかす方法を紹介します。

画像の背景だけをぼかす
  1. 同じ画像を2枚用意する
  2. 画像を切り抜く
  3. 背景用の画像をぼかす
  4. 2枚の画像を重ねる

同じ画像を2枚用意する

始めに2枚の画像を用意します。

Figmaで画像の背景をぼかす方法

画像を切り抜く

続いて、画像にある人物や動物を切り抜きます。

「Remove BG」というプラグインを使用して切り抜きます。

あわせて読みたい
Figmaで画像を切り抜く(トリミングする)簡単な方法! Figmaは他のデザインツール同様に画像を切り抜くことが出来ます。 この記事ではFigmaで画像を切り抜く方法を紹介していきます。 この記事を読むメリット Figmaで画像を...

背景用の画像をぼかす

背景用の画像をぼかします。

先ほど紹介した「レイヤーブラー」で画像の背景をぼかします。

2枚の画像を重ねる

最後に2枚の画像を重ねます。

切り抜いた画像が上に来るように重ねたら完成です。

以上の手順で画像の背景だけをぼかすことが出来ます。

Figmaで画像をぼかすのは簡単

この記事ではFigmaで画像をぼかす方法を紹介しました。

Figmaでは簡単に画像をぼかすことが出来ます。

まだやったことのない人は是非試してみてください。

  • URLをコピーしました!
目次