テキストボックスジェネレーター

好きなテキストを、プレーンな Unicode の罫線文字で描いた囲み枠やボーダーで囲みます。文字を入力または貼り付けて、枠のスタイル・配置・余白を選んだら、その結果をコピーしましょう。画像ではなくただのテキストなので、囲み枠はコメントや README、コードブロック、ターミナル、チャットにそのまま貼り付けられ、入力した内容がブラウザの外に出ることはありません。

あなたのテキスト

枠のスタイル

配置

余白

テキストボックスの使い方

1
テキストを入力または貼り付ける
枠で囲みたいテキストを入力します。1 行でも複数行でもかまいません。囲み枠は一番長い行に合わせて自動で広がります。
2
枠のスタイルを選ぶ
貼り付け先に合わせて、単線・角丸・二重線・太線・ASCII・破線・星・ブロックといった枠のスタイルを選びます。
3
配置と余白を設定する
枠内のテキストを左・中央・右のどこに揃えるかを決め、文字の周りに少しゆとりを持たせたいときは内側の余白を足します。

4
コピーして貼り付ける
囲み枠付きのテキストはすぐ下に即座に表示されます。コピーして、コメントや README、コードブロック、ターミナル、チャットに貼り付けましょう。

テキストを囲む枠やボーダーについて

罫線文字とは

グラフィックスがまだ登場するずっと前、ターミナルは表や枠、メニューを、まさにその用途のために作られた特別な Unicode 文字のまとまりを使って描いていました。角、水平線と垂直線、そして継ぎ目なくつながって連続したボーダーになる接合部分です。これらの文字は今でもあらゆる最新のアプリで機能するので、角がうまく合わないダッシュの並びではなく、本物の長方形でメモや見出しを囲むことができます。

それぞれのグリフはただのテキストなので、ここで作る囲み枠は画像ではありません。ほかの言葉と同じようにコピー＆ペーストでき、引用や編集をしても崩れず、テキストを読めるものなら何でも読み取れます。だからこそ、囲み枠付きのテキストは README ファイルやコマンドラインツール、コードコメントなど、あらゆるところで見かけるのです。

スタイルとレイアウトを選ぶ

枠のスタイルが雰囲気を決めます。単線と角丸は控えめで整っていて、ちょっとしたメモに向いています。二重線と太線はより目を引くので、タイトルや注意書きに適しています。ASCII は最も基本的なキーだけを使うため、貼り付け先が凝った文字に対応しているか分からないときの安全な選択肢です。星とブロックは装飾的で、チャットやバナーの中で目立ちます。

配置と余白は、言葉が枠の中でどう収まるかを左右します。中央揃えは短いタイトルに合い、左揃えはリストや文章には自然です。余白を 1 か 2 にすると、テキストが罫線に触れないように間隔ができ、たいていは文字にぴったり押し付けられた枠よりも読みやすくなります。

囲み枠付きテキストを上手に使う

囲み枠付きのテキストは、何かを際立たせるときに最も映えます。README の冒頭のタイトル、コードコメントの中の注記、ターミナルプログラムの ASCII バナー、フォーラムのコードブロックで強調したいメッセージなどです。あるテキストのまとまりに目に見える枠がふさわしいときに囲み枠を使い、長方形が適度な幅に収まるよう、中身は短く保ちましょう。

大切なルールはただ一つ、フォントです。囲み枠がきれいな四角を保てるのは等幅の環境だけなので、固定幅フォントが使われている場所に貼り付け、確信が持てないときはシンプルな線のスタイルを選びましょう。テキストに絵文字や全角の CJK 文字（日本語・中国語・韓国語）が混じっていると、右端が 1 列分ずれることがあるので、その差を最もうまく吸収してくれる素朴な単線や ASCII の枠を頼りにするとよいでしょう。

よくある質問

テキストボックスジェネレーターとは何ですか?

罫線文字（box-drawing characters）で描いた長方形でテキストを囲むツールです。単線・二重線・角丸の枠で使われるような、線や角のグリフを使います。結果はプレーンテキストなので、ばらばらの文字の羅列ではなく、きれいに枠で囲まれたブロックとしてどこにでも貼り付けられます。

囲み枠はどうやってコピーしますか?

テキストを入力してスタイルを選び、囲み枠付きの出力の上にあるコピーボタンを押します。罫線とテキストを含む枠全体がクリップボードにコピーされ、すぐに貼り付けられる状態になります。

囲み枠付きのテキストはどこで一番きれいに見えますか?

すべての文字の幅が同じになる等幅（monospace、固定幅）フォントが使われている場所ならどこでもきれいに見えます。GitHub や Discord、Reddit、Slack のコードブロック、README ファイル、ターミナル、コードコメントなどです。そうした場所では、枠がぴたりと揃ってきれいな長方形になります。

アプリによっては枠がゆがんで見えるのはなぜですか?

多くのチャット欄や文書では、i が m より細いといったプロポーショナル（可変幅）フォントが使われているため、枠の右端がガタガタに見えることがあります。枠をコードブロックの中に貼り付けるか、その範囲を等幅フォントに切り替えると、端がきれいに揃います。絵文字や日本語・中国語・韓国語などの全角文字はターミナルで 2 列分の幅をとるため、それらを囲んだ枠も 1 列ずれて見えることがありますが、これはフォントの性質であってエラーではありません。

スタイルごとの違いは何ですか?

どれも同じ長方形を、異なる線のグリフで描きます。単線・角丸・二重線・太線は、直角・曲線・二重・太めの線を使う Unicode の罫線文字です。ASCII はプラス・マイナス・パイプ（縦線）だけを使うので、最も基本的な環境でも機能します。破線は途切れた線を使い、星はアスタリスクで枠を組み立て、ブロックは塗りつぶしのハーフブロック形状でずっしりとした見た目にします。

入力したテキストはどこかに送信されますか?

いいえ。囲み枠は入力に合わせてすべてブラウザ内で組み立てられます。入力した内容がサーバーにアップロードされたり、記録・保存されたりすることはありません。