MENU
副業・稼ぐ力
PR

イラレの枠の作り方|和柄の飾り枠4種類を、型抜きと線の強弱で作る(操作動画つき)

イラレの枠の作り方|和柄の飾り枠4種類を、型抜きと線の強弱で作る(操作動画つき)
Kawai358
このページには広告・アフィリエイトリンクを含みます。

年賀状やお店の案内、手づくりのラベルに、少しだけ和の雰囲気を足したいと思ったことはありませんか。

そんなときに便利なのが、和柄でよく見る「飾り枠」です。

円や六角形を少し変えるだけで、ぐっと和風に見えます。

この記事では、イラレの枠の作り方を、和柄の飾り枠4種類で紹介します。

YouTubeのお手本の手順を、筆者のIllustrator 2026で実際に操作して作り直しました。

操作の録画(4倍速)もつけています。

案内役の黒猫
案内役の黒猫です。
今回は、藍色の枠に「七転八起」の4文字を入れてみました。
イラレの枠の作り方で作った和柄の飾り枠4種類。藍色の枠に七転八起の文字
完成見本。
左から、弧を4本重ねた枠、六角形の枠、三日月の枠、とがりの枠。
中に「七転八起」を1文字ずつ入れています。

この記事でわかること

  • 円から長方形を型抜きして、弧を作る方法。
  • 線幅プロファイルで、線の真ん中だけを太くする方法。
  • 内側と外側で角の丸みを変えて、和風の角を作る方法。
スポンサーリンク

お手本の動画と、この記事の進め方

お手本にしたのは、RUNGO デザインの学校さんのYouTube動画「和柄で使う『枠』4種類の作り方」です。

約13分の動画で、Illustratorだけで和柄の枠を4つ作っています。

参考にした動画(RUNGO デザインの学校「和柄で使う『枠』4種類の作り方」約13分)。

動画では、手で触りながら形を決めていく場面が多くあります。

この記事では、同じ形を作りやすいように、大きさや角の丸みを数字で書きました。

数字は筆者が作ったときの値なので、好みで変えてかまいません。

操作の録画で、全体の流れを見てみましょう

筆者がIllustrator 2026で4つの枠を作ったときの画面を、4倍速にしました。

音声はありません。

下の帯に、いま何をしているかを書いています。

イラレの枠の作り方の操作録画(4倍速・約4分)。①から④の順に作っています。

①の録画だけ、画面の右側を切っています。

作業中のほかのアプリが写り込んでいたためです。

4つの枠は、どんな機能で作るの?

枠 使う機能 形のポイント
①弧の枠 パスファインダーの「前面オブジェクトで型抜き」。
線幅プロファイル。
真ん中が太く、端が細い弧を4本重ねる。
②六角形 多角形ツール。
分割・拡張。
角の丸み(コーナー)。
内側の角を大きく、外側の角を小さく丸める。
③三日月 ①の枠を太らせて合体。
円から型抜き。
斜め4か所に、三日月形の厚みが出る。
④とがり 長方形から円2つを型抜き。
回転ツールでコピー。
上下左右の4か所に、内向きのとがりがつく。

イラレの枠の作り方は、この表の機能を組み合わせるだけです。

どの枠も、最後は「塗り」の図形になります。

色を変えたいときは、全部を選んで塗りの色を変えるだけです。

案内役の黒猫
①の枠は、③を作るときにも使います。
先に①から作るのがおすすめです。

準備:新しいドキュメントを作って、線の色を決める

メニューの「ファイル」>「新規」から、Webの1920×1080pxを選んで作成します。

お手本と同じサイズです。

線の色は、筆者は藍色(#165E83)にしました。

背景は白のままです。

和柄の枠は、藍色や朱色のように和の色にすると、それらしく見えます。

①弧を4本重ねた枠:円を型抜きして、線に強弱をつける

円と長方形を重ねて、型抜きする

  1. 楕円形ツール(L)で画面をクリックし、幅と高さを300ptにしてOKを押します。
  2. 長方形ツール(M)で画面をクリックし、幅400pt、高さ190ptにします。
  3. 2つを選んで、プロパティパネルの「整列」で「水平方向中央」と「垂直方向中央」を押します。
  4. パスファインダーの「前面オブジェクトで型抜き」を押します。
イラレの枠の作り方。円と長方形を重ねて、中央にそろえたところ
円(300pt)の上に長方形(400×190pt)を重ねて、中央にそろえたところ。
このあと長方形で型抜きします。

型抜きすると、円の上と下だけが残ります。

かまぼこのような形が、上下に2つできます。

まっすぐな線を消して、弧だけにする

塗りと線を入れ替えて(Shift+X)、線だけの形にします。

線の太さは20ptにしました。

ダイレクト選択ツール(A)で、上の形のまっすぐな線(下の辺)をクリックして、Deleteキーで消します。

下の形も、まっすぐな線(上の辺)を同じように消します。

型抜きで残った円の上と下。まっすぐな辺を消す前の状態
型抜きで残った上下の形。
このまっすぐな辺を、ダイレクト選択ツールで1本ずつ消します。

まっすぐな線は、線のちょうど真上をクリックするのがコツです。

少しずれると形ぜんぶが選ばれて、Deleteで弧まで消えてしまいます。

消えたときは、Command+Z(WindowsはCtrl+Z)で戻してやり直します。

線幅プロファイルで、真ん中を太くする

2本の弧を選んで、上のコントロールバーにある「線幅プロファイル」を開きます。

いちばん上の、真ん中がふくらんだ形(線幅プロファイル1)を選びます。

線の太さを32ptに上げると、真ん中が太く、端が細い弧になります。

イラレの線幅プロファイルで、真ん中が太く端が細い弧にしたところ
線幅プロファイル1をかけて、32ptにしたところ。
端に向かって細くなります。

同じ位置にコピーして、90度回す

Command+C でコピーして、Command+Shift+V(同じ位置にペースト)を押します。

回転ツール(R)を選んでReturnキーを押すと、回転のダイアログが開きます。

角度に90を入れてOKを押すと、左右にも弧が並びます。

最後に全部を選んで、メニューの「オブジェクト」>「アピアランスを分割」を選びます。

線が塗りの図形に変わって、①の枠の完成です。

イラレの枠の作り方で作った、弧を4本重ねた和柄の枠
①の完成。
上下の弧と左右の弧が、斜めの位置で交わります。

お手本では、上下の弧を少し内側へ寄せてから回していました。

寄せるほど、斜めのところのくびれが深くなります。

②六角形の枠:内側の角だけを大きく丸める

  1. 長方形ツールを長押しして、多角形ツールに切り替えます。
  2. 画面をクリックし、半径160pt、辺の数6でOKを押します。
  3. 塗りと線を入れ替えて(Shift+X)、線の太さを20ptにします。
  4. メニューの「オブジェクト」>「分割・拡張」でOKを押し、線を塗りの図形に変えます。
多角形ツールで描いた六角形を、線20ptにしたところ
多角形ツールで六角形を描いて、線を20ptにしたところ。
このあと分割・拡張します。

分割・拡張すると、六角形の外側の線と内側の線が、それぞれ別の点を持つようになります。

ここからが、和風に見せるポイントです。

内側の角は大きく、外側の角は小さく

ダイレクト選択ツールで、内側の6つの点だけを選びます。

筆者は、外側の点が入らないように、内側の点だけを囲むようにドラッグしました。

プロパティパネルの「コーナー」に45ptを入れると、内側の角が大きく丸くなります。

次に、外側の6つの点を Shiftキーを押しながら順にクリックして選び、コーナーを6ptにします。

イラレの枠の作り方。六角形の内側の角を45pt、外側を6ptで丸めた和柄の枠
②の完成。
内側の角が大きく丸いので、角のところだけ線が太く見えます。

お手本では、角に出る小さな丸(コーナーウィジェット)を引っぱって丸めていました。

数字で入れても、同じ形になります。

案内役の黒猫
内側と外側を同じ丸みにすると、ただの角丸の六角形になります。
丸みに差をつけるのが、和風に見せるコツです。

③三日月の枠:①の枠を太らせて、円から型抜きする

①の枠をコピーして、すき間を埋める

①の枠を選んで、Returnキーで移動のダイアログを開きます。

垂直方向に-400ptを入れて「コピー」を押すと、上にもう1つできます。

お手本では、コピーした枠に線を足して、角の形状を「ラウンド」にし、すき間がふさがるまで太くしていました。

そのあと分割・拡張して、パスファインダーの「合体」でひとつにします。

筆者は同じ結果を早く作るために、「オブジェクト」>「パス」>「パスのオフセット」を使いました。

オフセット10pt、角の形状「ラウンド」です。

できた形と元の枠を選んで「合体」し、内側の穴の点をダイレクト選択ツールで選んで、Deleteキーを2回押して消します。

①の枠を太らせて合体し、内側を消して塗りつぶした形
①の枠を太らせて合体し、内側の穴を消したところ。
斜めの4か所が少しくびれています。

円を後ろに置いて、型抜きする

  1. 楕円形ツールで、幅と高さ345ptの円を描きます。
  2. 円と、さっきの形を選んで、「水平方向中央」と「垂直方向中央」でそろえます。
  3. 円だけを選んで、Command+Shift+[(最背面へ)で後ろに回します。
  4. さっきの形を選んで、「オブジェクト」>「変形」>「拡大・縮小」で94%に縮めます。
  5. 2つを選んで、パスファインダーの「前面オブジェクトで型抜き」を押します。
イラレの枠の作り方で作った、細い円の斜め4か所に三日月が入った和柄の枠
③の完成。
細い輪の内側、斜めの4か所に三日月形の厚みが残りました。

縮める割合で、三日月の太さが変わります。

100%のままだと三日月がとても細くなったので、筆者は94%にしました。

お手本ではこのあと、ペンツールで余分な点を消して、三日月の先をなめらかに整えていました。

④とがりの枠:長方形から円を2つ型抜きする

輪を用意する

楕円形ツールで345ptの円を描き、塗りなし、線の太さ24ptにします。

これが枠の輪になります。

とがりのパーツを作る

  1. 長方形ツールで、幅40pt、高さ31.5ptの長方形を描きます。
  2. 楕円形ツールで、幅と高さ40ptの円を描き、中心を長方形の左下の角に合わせます。
  3. 円を選んでReturnキーを押し、水平方向40ptで「コピー」します。
    右下の角にも円が来ます。
  4. 長方形と円2つを選んで、パスファインダーの「前面オブジェクトで型抜き」を押します。

2つの円のあいだだけが残って、下に向かってとがった形ができます。

筆者はプロパティパネルのX・Yに数字を入れて、このパーツを輪のいちばん上に置きました。

とがった先が、輪の内側を向くように置きます。

とがりのパーツを、輪の上に置いたところ
型抜きでできたとがりのパーツ(右下の小さな形)と、輪の上に置いた状態。

回転ツールで、4か所に配る

パーツを選んだまま回転ツール(R)にして、Optionキー(WindowsはAltキー)を押しながら輪の中心をクリックします。

回転の中心が輪の真ん中になり、ダイアログが開きます。

角度90で「コピー」を押し、Command+D(変形の繰り返し)を2回押すと、上下左右の4か所にとがりがつきます。

最後に、輪とパーツを全部選んで「分割・拡張」し、パスファインダーの「合体」でひとつにします。

イラレの枠の作り方で作った、上下左右に内向きのとがりがある和柄の枠
④の完成。
輪の上下左右に、内向きのとがりがつきました。

お手本ではさらに、とがりのつけ根の角を少し丸めて、輪となめらかにつないでいました。

4つの枠がそろいました

Illustratorで実際に操作して作った和柄の枠4種類
Illustrator 2026で実際に操作して作った4つの枠。

イラレの枠の作り方は、どれも円や六角形という単純な形から始まっています。

型抜きで一部を削る、線の太さに強弱をつける、角の丸みに差をつける。

この3つの組み合わせで、和柄らしい枠になりました。

枠の中に「七転八起」を入れてみました

せっかく4つの枠ができたので、中に四字熟語を1文字ずつ入れました。

選んだのは「七転八起」です。

何度転んでも、そのたびに起き上がる、という意味です。

このブログは、50代からのセカンドキャリアで「もう一度やり直す」ことを書いています。

筆者も53歳で早期退職して、いまも試しては直してを繰り返しています。

ブログのテーマに、いちばん合う4文字だと思いました。

文字は、しっぽり明朝 B1 ExtraBold を使い、枠と同じ藍色にしました。

枠が太いぶん、文字は枠の内側に余白が残る大きさにしています。

イラレの枠の作り方で作った和柄の枠に、七転八起の4文字を入れた見本
藍色の枠と「七転八起」。
2×2に並べると、ラベルや見出しの飾りにも使えます。
案内役の黒猫
年賀状なら、干支の1文字を枠に入れるだけでも和風になります。
好きな漢字で試してみてください。

うまくいかないときは、ここを見てください

確認したい5つのこと

  • 型抜きしても何も残らない:長方形が円より大きすぎないか。
    上下に円がはみ出す高さにします。
  • 弧まで消えてしまう:まっすぐな線の真上をクリックしているか。
    ずれると形ぜんぶが選ばれます。
  • 線幅プロファイルが選べない:形がグループのままでも選べます。
    線が「なし」になっていないかを確かめます。
  • 六角形の角が丸くならない:分割・拡張したあとに、点を選んでいるか。
    線のままだとコーナーが効きません。
  • ④のとがりがずれる:円の中心が、長方形の左下と右下の角にぴったり来ているか。

よくある質問

Q. 線の色は、あとから変えられますか?

変えられます。

どの枠も最後は塗りの図形なので、全部を選んで塗りの色を変えれば、まとめて変わります。

Q. 枠を大きくすると、形がくずれませんか?

くずれません。

分割・拡張したあとの図形は、拡大しても形がそのままです。

拡大・縮小のダイアログで「線幅と効果を拡大・縮小」の設定を気にする必要もありません。

Q. Illustratorのバージョンが古くても作れますか?

型抜き・線幅プロファイル・コーナーの丸みは、古いバージョンにもある機能です。

ただ、ボタンの場所や画面の見た目は、この記事のIllustrator 2026とは違うことがあります。

Q. 文字を入れずに、枠だけで使ってもいいですか?

もちろんです。

お手本でも、ロゴやチラシの一部に使える要素として紹介されていました。

まとめ

イラレの枠の作り方|和柄の飾り枠4種類

  • ①弧の枠:円から長方形を型抜きし、線幅プロファイル1で真ん中を太くして、90度回してコピー。
  • ②六角形の枠:分割・拡張して、内側の角を45pt、外側を6ptで丸める。
  • ③三日月の枠:①を太らせて合体し、94%に縮めて円から型抜き。
  • ④とがりの枠:長方形から円2つを型抜きしたパーツを、回転ツールで4か所に配る。

Illustratorで形を作る記事は、ほかにも書いています。

Illustratorをこれから使うなら

この記事の枠は、Illustratorの単体プランか、Creative Cloudのプランで作れます。

型抜きも線幅プロファイルも、Illustratorに最初から入っている機能です。

ただ、ツールを契約しただけで何かが変わるわけではありません。

筆者もWEBデザインのオンラインスクールに通いましたが、そこでは1円も稼げませんでした。

作りたいものを先に決めて、まずは無料体験でひとつ作ってみるのがおすすめです。

スポンサーリンク(PR)

Illustratorの無料体験を見る(PR)

Illustratorの料金を見る(PR)

Creative Cloudのプランを見る(PR)

Adobe Creative Cloud の広告バナー(PR)

※上記はアフィリエイトリンクです。

Illustratorで何ができるかは、こちらのページにまとめています。

Illustratorでできること|動画で見る作り方

この記事で確認した範囲

4つの枠の手順は、参考動画の音声と画面で確かめたものです。

枠の操作は、筆者のMacのIllustrator 2026で実際に行い、その画面を録画しました。

新規ドキュメントの作成と、画面の拡大の位置合わせだけは、スクリプトで行っています。

③は、お手本の「線を足して太くする」方法のかわりに、同じ形になる「パスのオフセット」を使いました。

③と④の仕上げ(ペンツールでの点の整理と、つけ根の角丸め)は、録画では省いています。

いちばん上の完成見本(「七転八起」入り)は、4つの枠の太さと位置をそろえるため、同じ形をスクリプトで作り直したものです。

大きさや丸みの数字は筆者が決めた値で、お手本の動画で示された値ではありません。

参考:RUNGO デザインの学校「和柄で使う『枠』4種類の作り方 | Illustratorの使い方」(YouTube)。

手順は動画を参考にし、画面と作例は筆者が作り直したものです。

案内役の黒猫

Instagramでは、図解を週3本出しています。

50代からのAdobeのコツと、心を軽くする本の1行を、黒猫が1分で案内します。

保存して、明日そのまま試せる形にしています。

Instagramを見る@yoshihirok0358

Xからの読者コメントをお待ちしています。
ブログ更新の励みになります!
Facebookでのコメントをお待ちしています。
ブログ更新の励みになります!
スポンサーリンク
Profile
Kawai358
Kawai358
「Re:じぶん再起動ノート」運営者
仕事、家計、親のこと。自分は後回しになっていませんか。再就職、パートや在宅の小さな収入、心が軽くなる本の言葉、Adobeで暮らしを楽しむコツを、黒猫と一緒にやさしく届けています。53歳で早期退職→再就職、いまは会社員とブログの二足のわらじ。
スポンサーリンク
記事URLをコピーしました