Canvaで文字の縁取り・袋文字を作る方法|3分でできる簡単テクニックで二重袋文字も

Canvaで縁取り、袋文字

Adobe IllustratorやPhotshop、Inksscapeで作るような袋文字・縁どり文字は、Canvaでは作れないですよね?

 

いいえ、Canvaでも袋文字・縁どり文字は作れます

 

まずは下の動画をご覧ください(注意:1分49秒の動画です)。

Canvaで二重袋文字を作る様子

こちらの動画は、Canvaで二重袋文字を作る様子をおさめたものです。「3分でできる」とタイトルに書いたように、非常に短時間で袋文字を作成することができるのです。

この記事ではCanvaで袋文字をつくる方法について、画像を用いてわかりやすく解説します。

あわせて読みたい

そもそも袋文字とは?

Wikipediaでは以下のような説明がなされています。

袋文字(ふくろもじ)は文字修飾の一種で、輪郭線だけがある文字を指す。白抜き文字(しろぬきもじ)、縁取り文字(ふちどりもじ)、アウトライン文字とも呼ぶ。

フリー百科事典『ウィキペディア(Wikipedia)』

文字だけではイメージしづらいと思いますので、こちらの画像後ご覧ください。

袋文字、二重袋文字をCanvaで描く

厳密には、輪郭線のみがある中抜き文字のことを指して「袋文字」と呼ぶようですが、今回は画像のような画像たちを「袋文字」「二重袋文字」と呼ぶことにします。

この記事では、以下のような画像を作れるようになることを目指します。

Canva(キャンバ)で袋文字を作る手順

手順1:好きなテキストを入力する

まずは、好きなテキストを入力してください。

太めのフォントを選ぶと映えやすい

手順2:テキスト部のキャプチャを撮り、同じ画面に貼り付ける

Windowsの場合は【Windows+Shift+S】、Macの場合は【Command+Shift+4】で画面の部分キャプチャを撮り、同じ画面内に貼り付けましょう。

※キャプチャ部を分かりやすくするため、一部背景色を付けている

手順3:画像を編集→背景リムーバを押す

貼り付けた画像を選択し、画面上部の「画像を編集」をクリックすると、左側に各種メニューが表示されます。

メニューの中から「背景リムーバ」を選び、クリックしてください。

Canvaの「背景リムーバ」は自動的に背景除去してくれる機能

しばらく待つと、以下のように背景が除去されるので画面左下の「適用」をクリックしてください。

背景が除去され、最背面の背景色が透けて見えるのがわかる
画面左下の適用ボタンはこのような見た目

あわせて読みたい

手順4:画像を編集→影付き→グローを押す

引き続き画像を選択し、画面上部の「画像を編集」から、「影付き」メニューを選択してください。

選択すると、以下のように細分化されたメニューが開くので、その中から「グロー」をクリックしましょう。

クリックしてしばらく待つと、浮き出しエフェクトのような加工が画像に施されます。

グローを押したときにはこのような加工が施される

手順5:グローの設定を調整する

このままでは使えないため、「グロー」の設定を変更しましょう。「グロー」のアイコンに設定マークが表示されるので、これをクリックすれば、設定変更がおこなえるようになります。

「透明度」を100に、「ぼかし」を0に設定し、サイズはお好みで調整する。今回は7とした。縁取りをピンクにしたかったので、今回は「カラー」をピンクに設定しました。

入力が完了したら「適用」をクリックして、設定を確定させたら完成です。

上段が元のテキスト、下段が今回作成した袋文字

Canvaの公式サイトはこちら

Canva(キャンバ)で二重袋文字を作る手順

二重袋文字を作る手順は、ほぼ袋文字の作り方と同じです。

手順1:好きなテキストを入力する

まずは、好きなテキストを入力してください。

太めのフォントを選ぶと映えやすい

手順2:テキスト部のキャプチャを撮り、同じ画面に貼り付ける

Windowsの場合は【Windows+Shift+S】、Macの場合は【Command+Shift+4】で画面の部分キャプチャを撮り、同じ画面内に貼り付けましょう。

※キャプチャ部を分かりやすくするため、一部背景色を付けている

手順3:画像を編集→背景リムーバを押す

貼り付けた画像を選択し、画面上部の「画像を編集」をクリックすると、左側に各種メニューが表示されます。

メニューの中から「背景リムーバ」を選び、クリックしてください。

Canvaの「背景リムーバ」は自動的に背景除去してくれる機能

しばらく待つと、以下のように背景が除去されるので画面左下の「適用」をクリックしてください。

背景が除去され、最背面の背景色が透けて見えるのがわかる
画面左下の適用ボタンはこのような見た目

適用したら、画像をコピー&ペーストして複製しておく。

上段が元のテキスト、下段の灰色背景部が画像×2

手順4:2つの画像のうち1つを選び、画像を編集→影付き→グローを押す

引き続き画像を選択し、画面上部の「画像を編集」から、「影付き」メニューを選択してください。

選択すると、以下のように細分化されたメニューが開くので、その中から「グロー」をクリックしましょう。

クリックしてしばらく待つと、浮き出しエフェクトのような加工が画像に施されます。

手順5:手順4で加工した画像を選択し、グローの設定を調整する

このままでは使えないため、「グロー」の設定を変更しましょう。「グロー」のアイコンに設定マークが表示されるので、これをクリックすれば、設定変更がおこなえるようになります。

「透明度」を100に、「ぼかし」を0に設定し、サイズはお好みで調整する。今回も袋文字作成時と同じく7としました。縁取りをピンクにしたかったので、こちらも袋文字作成時と同じく「カラー」をピンクに設定しました。

手順6:残りの画像に対して、手順4と手順5を適用する
(※「サイズ」「カラー」を変更する必要あり)

もうひとつ、未加工の画像が残っているはずです。その画像に対して、手順4と同じような作業をおこないます。

画像を選択し、画面上部の「画像を編集」から、「影付き」メニューを選択
→ 「グロー」をクリック
→ 「適用」をクリック

次に、手順5と同様に「グロー」の設定マークをクリックし、詳細設定を変更していきましょう。

「透明度」を100に、「ぼかし」を0に設定するのは手順5と同様です。

異なるのはサイズとカラー。サイズは、もうひとつの画像が7なので、別の数字を設定します。今回は3とします。

また、ピンク-白-黒の配色にしたいので、こちらの「カラー」は白を選びました。

入力が完了したら「適用」をクリックして、設定を確定させましょう。

手順7:画像を重ねる

最後に、作成した2つの画像を重ねます。画像を選択し、配置をクリックし、上下左右の中央ぞろえをそれぞれクリックしましょう。

これで二重袋文字も完成できました。

二重袋文字が完成した!

Canvaの公式サイトはこちら

まとめ|Canvaではできないと思っていた袋文字作成が簡単にできた

Canva(キャンバ)では袋文字が作れないと思われがちですが、背景リムーバと影付きを組み合わせることでかんたんに作れることがわかりました。Canvaで袋文字・二重袋文字を作成できるようになると、よりデザインの幅を広がります。早速実践してみてください。

あわせて読みたい
あわせて読みたい

  • この記事を書いた人

dice

Adobe製品のお得な買い方、スキルアップのためのオンライン学習プラットフォーム情報、デジタルマーケティングの基礎知識など、大人の学びに役立つ情報を発信していきます。コストパフォーマンス高いスキルアップ・リスキリングのお供に。

人気記事

デジハリでAdobeCCを安く購入する方法 1

デザインや動画編集などのクリエイティブな作業に必要不可欠なAdobe Creative Cloud (以下、AdobeCCと略します)を契約すると、IllustratorやPhotoshopなど複数の ...

Canva_有料版と無料版の違いは?_Pro版を使うメリットを解説 2

Canva は、誰でも簡単にプロのようなデザインができるツールです。 バナーやSNS投稿、 名刺やポスター、プレゼン資料、YouTubeサムネイルにいたるまで、豊富なテンプレートを使って誰でも簡単にデ ...

SocialDogの評判、料金プランやメリット・デメリットを徹底解説 3

Twitterのアカウント運用はSNSマーケティングの王道です。 Twitterで注目を集めることで、ビジネスの成長・マネタイズにつなげられます。 とはいえ、Twitterのアカウントを運用するのは簡 ...

AdobeXDのスタータープランは無くなった?誤報です!正攻法でダウンロードする方法を解説 4

Adobe XD はWebサイトやスマホアプリのワイヤーフレーム・モックアップ・プロトタイプなどの作成に使用されるデザインツールです。 WebデザイナーやUI/UXデザイナーにとっては不可欠なツールの ...

【Canva】画像から人物を切り抜きたい!背景の削除と透過方法について画像つきで解説 5

Canvaには、「画像から人物を切り抜いて、背景なしの状態で保存する」機能があります。 ワンクリック操作で画像の切り抜きができるため、初心者にも優しい便利機能です。   この記事ではCanvaの「背景 ...

-Canva, Webデザイン, デジタルマーケティング
-