お絵かき図鑑
お絵かき図鑑

【Procreate】テキストの入れ方は?文字でイラストを装飾しよう

更新日:2025.09.12
Procreateのテキストの使い方アイキャッチ

Procreateで文字を編集したい。
テキストはどうやって入力すればいいのだろう?

今回は、Procreateでテキストを入力する方法や、イラスト制作でテキストを活用する方法をご紹介します。

業界最大手のお絵かき学習サイト!今なら無料お試し実施中

充実の講師・講座数!様々なプロのテクニックをものにして描ける自分になろう!
自宅で好きな時間に自分のペースで学習できるので空いた時間に学べる!
まずは7日間の無料お試しで体験しよう!

詳細はこちら >

業界最大手のお絵かき学習サイト!今なら無料お試し実施中

充実の講師・講座数!様々なプロのテクニックをものにして描ける自分になろう!
自宅で好きな時間に自分のペースで学習できるので空いた時間に学べる!
まずは7日間の無料お試しで体験しよう!

詳細はこちら >

Procreate テキストの基本的な使い方

テキストを入力する

テキストを追加する

テキストを追加する

テキストは「アクション」メニューから追加できます。
画面左上のスパナボタンをタップして、「テキストを追加」を押します。

文字を入力する

文字を入力する

画面の下部にキーボードが表示されるので、文字を入力します。
キーボードを閉じたい場合は、キーボード内の右下のボタンを押します。

テキストボックスを調整する/テキストを移動する

テキストボックスを調整する/テキストを移動する

テキストを入力する際、テキストの周りに水色のテキストボックスが表示されます。

テキストボックスの枠内に沿って、入力した文字が改行されます。
正しい位置で改行されない場合は、水色のガイド線上をドラッグして、テキストボックスのサイズを調整しましょう。

また、ガイド線以外の部分をドラッグすると、文字の位置を移動できます。

テキストの色を変える

文字を選択する

文字を選択する

テキストボックス内をダブルタップすると、文字が選択されます。
この状態で、画面右上のカラーボタンを押します。

色を変える

色を変える

カラーサークルから色を選ぶと、テキストの色が変更されます。

文字が選択されていないと、カラーを変更しても画面に反映されません。
選択されている文字は、文字の周りが水色でハイライトされます。

文字が選択されていることを確認してから、色やサイズなどの編集を行いましょう。

テキストのフォントやサイズを変更する

スタイル編集パネルを表示する

スタイル編集パネルを表示する

フォントの種類やサイズの調整は、スタイル編集パネルから行います。

テキストボックス内をダブルタップして文字を選択し、メニューを表示します。
このメニュー内には、配置や縦書きを設定するボタンがありますが、スタイル編集パネルでも設定が可能です。

メニュー内のフォント欄をタップして、スタイル編集パネルを表示します。

スタイル編集パネルの画面

スタイル編集パネルの画面

スタイル編集パネルからは、フォントの種類やスタイル、フォントの属性を設定できます。

文字を編集する

スタイル編集パネルの上部ボタン

スタイル編集パネルの左上には、4つのボタンがあります。

左から順番に、キーボードの表示、選択中の文字の削除、選択中の文字のコピー、文字のペーストの機能です。
入力した文字を編集したいときに使います。

フォント/スタイルを変更する

フォント/スタイルを変更する

「フォント」の項目から、フォントの種類を変更できます。

「スタイル」欄には、各フォントに対応したスタイルが表示されます。
斜体になる「Italic」や、太字で強調される「Bold」など、使い分けてみてください。

フォントスタイルを変更する

フォントスタイルを変更する

「フォントスタイル」からは、文字のサイズや字間を調整できます。

  • サイズ:文字の大きさを変更できます。
  • カーニング:隣り合う文字の間隔を調整できます。
  • トラッキング:全ての文字の間隔を調整できます。
  • レディング:行の間隔を調整できます。
  • ベースライン:文字を入力する際のカーソル線の位置を調整できます。
  • 不透明度:文字の透明度を調整できます。

フォント属性を変更する

フォント属性を変更する

「フォント属性」の上段の4つのボタンからは、文字を整列できます。
左から順番に、左揃え、中央揃え、右揃え、両端揃えのボタンです。

中段の3つのボタンからは、テキストに効果をつけられます。
左から順番に、下線、中抜き、縦書きのボタンです。

下段のスイッチは、大文字化の機能です。
スイッチをONにすると、小文字を入力した箇所も大文字で表示されます。

ダウンロードしたフォントを読み込む

カスタムフォントをダウンロードする

Procreateは日本語のフォントが少ない……。
そんなときは、日本語のカスタムフォントをインストールしましょう。

インターネット上には、様々なフォントが公開されています。
今回は、手書き感がある油性マジックのフォント、「たぬき油性マジック」をダウンロードします。

ダウンロードしたファイルを解凍する

ダウンロードしたファイルを解凍する

Procreateではzip形式のファイルは読み込めないので、解凍しておきましょう。
「ファイル」アプリを開き、ダウンロードしたzipファイルを選択すると、ファイルが解凍されます。

フォントを読み込む

フォントを読み込む

スタイル編集パネルの右上にある、「フォントを読み込む」ボタンを押します。

解凍したttfファイルを選択する

解凍したttfファイルを選択する

フォントをダウンロードしたフォルダへ遷移して、先ほど解凍したttfファイルを選択します。

カスタムフォントを使う

カスタムフォントを使う

フォントが読み込まれると、「フォント」欄から「たぬき油性マジック」が選べるようになります。

お好みのフォントを探して、Procreateで使ってみてください。
各フォントにはそれぞれ利用規約があるので、よく読んでから使いましょう。

テキストを変形する

テキストを変形する

テキストを入力したレイヤーを選択して、画面左上の「変形」ボタンを押します。
テキストの周囲に表示されるガイド線をドラッグすると、テキストの拡大/縮小や回転ができます。

画面下部の欄から、変形の方法を選択できます。

「フリーフォーム」では、縦横の比率を自由に変形できます。
「均一」からは、縦横の比率を保ったまま変形できます。

「フリーフォーム」又は「均一」でテキストを変形した場合、テキストのレイヤーは保たれ、文字の再編集が可能です。
「ディストーション」又は「ワープ」で変形した場合、テキストのレイヤーはラスタライズされ、文字の編集ができなくなります。

Procreate テキストをイラスト制作に活用する

テキストのラスタライズやイラスト制作での活用法など、テキストの応用例を解説しています。

テキストをラスタライズする

テキストは「ベクターレイヤー」に属する

テキストは「ベクターレイヤー」に属する

Procreateで新規レイヤーを作成すると、ラスター形式のレイヤーが作成されます。
テキスト入力から作成したレイヤーは、ラスター形式ではなく、ベクター形式に属します。

レイヤー欄のサムネイルに「A」と表示されているレイヤーが、ベクター形式のテキストレイヤーです。
ベクター形式のテキストレイヤーは、以下の特徴があります。

  • テキストやスタイルの再編集が可能
  • 拡大・縮小を繰り返しても粗くならない

テキストの編集に便利なベクターレイヤーですが、自由変形やフィルターなどが使えない欠点もあります。
テキストを複雑に変形したり、フィルターをかけたりする場合は、レイヤーのラスタライズが必要です。

テキストをラスタライズする

テキストをラスタライズする

ラスタライズしたいテキストレイヤーをタップして、「ラスタライズ」を選びます。

「ラスターレイヤー」に変換した後

「ラスターレイヤー」に変換した後

ベクターレイヤーをラスタライズすると、ラスターレイヤーに変換されます。
レイヤーのサムネイルも、「A」の文字からレイヤーに描画されている内容に変わっています。

上記のラスタライズ操作をせずとも、ベクター形式のテキストレイヤーに自由変形やフィルターを実行すると、自動的にラスタライズが行われます。
テキストをラスタライズすると、文字入力やテキストのスタイル編集はできなくなるので、注意してください。

テキストの一部に色をつける(クリッピング)

スタンド看板にテキストを重ねる

スタンド看板にテキストを重ねる

フォント:Chalkdusterに設定したテキストを、スタンド看板に重ねています。

スタンド看板には既に影が塗られており、影の領域内のテキストが浮いて見えます。
テキストの色を部分的に調整して、馴染ませる必要があります。

テキストの色を部分的に変更する

テキストの色を部分的に変更する

テキストを書いたレイヤーの上に影レイヤーを作成します。

影レイヤーをタップして、「マスクをクリップ」を選択します。
「マスクをクリップ」を設定したレイヤーは、下のレイヤーからはみ出た部分が隠れるようになります。

この影レイヤー上に、テキストの影色を塗ります。

看板の下部にテキストを入れる

看板の下部にテキストを入れる

全体が影色になるテキストは、影レイヤーを作らず、テキストの色自体を変えてもOKです。

テキストの一部に色をつける(クリッピング+合成モード)

レイヤーを結合する

レイヤーを結合する

これから看板に影をつける場合、テキストと看板のレイヤーを結合して、上から合成モードで影入れすると早いです。

テキストと看板のレイヤーを右スワイプして、複数選択します。
その後、複数選択したレイヤー上でピンチインの操作をして、レイヤーを結合します。

乗算レイヤーを作成する

乗算レイヤーを作成する

新規レイヤーを作成します。
合成モードの欄をタップして、「標準」から「乗算」に変更します。

影を入れる

影を入れる

乗算レイヤーに色を塗ると、テキストも含めた看板全体に影をつけることができます。

テキストにフィルターをかける

「調整」メニューからフィルターをかける

「調整」メニューからフィルターをかける

テキストを入力したレイヤーを選択して、画面左上の「調整」ボタンを押します。
フィルターの一覧が表示されるので、お好みのフィルターを選びましょう。

「ゆがみ」をかける

「ゆがみ」をかける

フィルターの「ゆがみ」→「クリスタル」を選択して、テキストをゆがませました。
テキストレイヤーにフィルターを実行すると、自動的にラスタライズされます。

テキストをネオン風に発光させる

レイヤーを複製する

レイヤーを複製する

合成モードを設定したレイヤーを複製してガウスぼかしを重ねていくと、発光している表現ができます。
発光の表現の際には、背景の明度を低くしておくと、光が目立ちやすいです。

フォント属性を中抜きに設定したテキストを作成します。
テキストのレイヤー上で左にスワイプして、「複製」を押します。

複製したレイヤーにガウスぼかし(小)をかける

ガウスぼかし(小)をかける

複製したレイヤーを選択して、「調整」→「ぼかし(ガウス)」を選びます。

キャンバス上で右にドラッグして、ぼかしの量を1%に設定します。
テキストのサイズによってぼかし量は変わりますが、まずは、ほんの少しぼやける程度に抑えます。

ぼかしたレイヤーの合成モードを「追加」にする

合成モードを「追加」にする

ぼかしをかけたレイヤーの合成モードを、「標準」から「追加」に変更します。
「追加」は下のレイヤーと混ざると明るくなるので、光を表現するのに適しています。

レイヤーの内容が分かりやすいように、レイヤー名を「ガウス小」に変更します。

「ガウス小」レイヤーを複製して、ガウスぼかし(中)をかける

ガウスぼかし(中)をかける

「ガウス小」レイヤーを複製して、同じ手順でガウスぼかしをかけます。
ぼかしの量は3%にして、中程度ぼかします。

レイヤー名を「ガウス中」に変更します。

「ガウス中」レイヤーを複製して、ガウスぼかし(大)をかける

ガウスぼかし(大)をかける

「ガウス中」レイヤーを複製して、同じ手順でガウスぼかしをかけます。
ぼかしの量は9%にして、大きくぼかします。

レイヤー名を「ガウス大」に変更します。

「ガウス大」レイヤーを複製する

レイヤーを複製する

「ガウス大」レイヤーを複製します。
合成モードが「追加」のぼかしレイヤーが重なり、発光しているように見えます。

元のテキストのレイヤーを白くする

元のテキストのレイヤーを白くする

ぼかしていない元のテキストレイヤーを選択して、「調整」→「色相、彩度、明るさ」から明るさを上げ、白っぽくします。
元のテキストレイヤーを白色に寄せると、発光している物体の中心に向かうほど色が明るくなる表現になり、リアリティが出ます。

クリスタでチャレンジ!厚塗り風イラスト講座

厚塗りのエッセンスを取り入れた「厚塗り風」イラストの製作工程を実演を交えて解説します。
厚塗りイラストに興味がある方、情報量の多い絵を描きたい方にオススメ!

詳細はこちら >

クリスタでチャレンジ!厚塗り風イラスト講座

厚塗りのエッセンスを取り入れた「厚塗り風」イラストの製作工程を実演を交えて解説します。
厚塗りイラストに興味がある方、情報量の多い絵を描きたい方にオススメ!

詳細はこちら >

まとめ

Procreateのテキスト機能の解説でした。
テキスト入力は、イラスト制作や漫画のセリフ、ロゴデザインなど、様々な場面で活用できます。
テキストの使い方を覚えて、Procreateでの創作活動に活かしてみてください。

関連講座
関連講座

髪の描き方講座

ショート〜ロング、テール系、三つ編みなど髪型別の描き方や、
きれいな髪の線画を描くコツを学ぼう!
今なら無料お試し実施中!!

詳細はこちら >

写真から骨格を理解して、全身イラストのレベルをアップさせよう!

写真さえあれば学べるので、全くの絵の初心者でも安心♪
体の側面、腕や足の向きなどを見つけて、「身体が描けない」を卒業しよう!
今なら無料お試し実施中です。

詳細はこちら >

逆光イラストの描き方をプロが徹底解説!

逆光に焦点を当ててハイライトの付け方や影の付け方をプロが解説!
重ねムラブラシを使いこなして塗りの上達を目指そう!
今なら無料お試し実施中です。

詳細はこちら >

写真から骨格を理解して、全身イラストのレベルをアップさせよう!

写真さえあれば学べるので、全くの絵の初心者でも安心♪
体の側面、腕や足の向きなどを見つけて、「身体が描けない」を卒業しよう!
今なら無料お試し実施中です。

詳細はこちら >
記事の先頭に
もどる
記事の先頭にもどる

×

Oekakizukan header 400x104