productivity

ラベルシート作成

ラベル用紙を実寸で設計し、CSV / TSV差し込み、画像・QR・バーコード、使いかけ位置、印刷補正を反映したPDFを作成します。

ローカル処理

ファイルについてこのツールで選択したファイルや入力内容は、Browser Kittyのバックエンドへアップロードせずブラウザ内で処理します。

操作デモ 実際の操作の流れを短い動画で確認できます。

このツールについて

ラベルシート作成は、ラベル用紙の物理寸法を指定して1枚分のラベルをデザインし、同じレイアウトをシート全体へ配置して印刷用PDFを作るツールです。A4 / Letter / カスタム用紙に対応し、ラベル幅・高さ、行列、余白、間隔をmmまたはinchで調整できます。テキスト、ローカル画像、QRコード、Code 128、Code 39をキャンバスへ追加し、移動・リサイズ・複製・前後移動・Undo / Redoで編集できます。

CSV / TSVや表データを読み込んで列をテキストやコードへ割り当てる差し込みに加え、1ページ目で既に使用した位置を避けて残りのラベルだけを使う運用にも対応します。印刷位置はX/Yを0.1 mm単位で補正し、位置合わせ用PDFで確認できます。用紙設定、要素、埋め込み画像、差し込みデータ、使用済み位置、出力設定は.labelsheet.jsonへ保存して再開できます。すべての編集・コード生成・PDF生成はブラウザ内で行い、入力データをアプリから外部サーバーへ送信しません。

こんなときに便利

宛名、商品名、管理番号などをCSVから差し込み、同じラベル用紙へまとめて印刷したい
QRコードやCode 128 / Code 39を含む在庫・備品・棚札ラベルをブラウザだけで作りたい
メーカー名に依存せず、手元のラベル用紙を実測寸法で設定して印刷したい
途中まで使ったラベルシートの空いている位置だけを使って、残りのデータを順番に印刷したい
プリンターの給紙ずれに合わせてX/Y位置を補正し、同じ補正値を次回も再利用したい
画像や差し込みデータを含むラベル作業を1つのプロジェクトファイルとして保存・移動したい

できること

このツールで利用できる主な機能です。

A4 / Letter / カスタム用紙で、ラベル幅・高さ、行列、余白、間隔をmm / inch単位で設定
テキスト、ローカルPNG / JPEG / WebP画像、QRコード、Code 128、Code 39をキャンバス上で配置・編集
UTF-8 / UTF-8 BOM / Shift_JISのCSV・TSV、ドラッグ＆ドロップ、表データ貼り付けから差し込みデータを作成
1ページ目の使用済みラベル位置を指定し、空いている位置だけへ差し込みデータを順番に配置
X/Yを0.1 mm単位で補正し、名前付き補正プリセットや位置合わせ用PDFで印刷位置を調整
作業内容を画像・差し込みデータ込みの.labelsheet.jsonへ保存し、後から復元

使い方

「ツールを開く」を押し、用紙プリセットまたはA4 / Letter / カスタム用紙を選び、ラベル寸法、行列、余白、間隔を設定します。
ラベルキャンバスへテキスト、画像、QRコード、Code 128、Code 39を追加し、位置・大きさ・内容を調整します。
内容を行ごとに変える場合はCSV / TSVを読み込むか表データを貼り付け、列をテキストやコード要素へ割り当てます。
使いかけ用紙を使う場合は、シート画面で1ページ目の既に使用済みの位置を選択します。残りのデータは空き位置へ順番に配置されます。
印刷位置にずれがある場合は位置合わせ用PDFを作成し、X/Y補正を0.1 mm単位で調整して必要ならプリセットへ保存します。
最終ページPreviewを確認して印刷用PDFを生成します。印刷時は実際のサイズ / 100%を選び、不要な自動拡大縮小を無効にします。
後から作業を再開する場合は.labelsheet.jsonを保存します。用紙設定、ラベル要素、画像、差し込みデータ、使用済み位置、出力設定をまとめて復元できます。

対応範囲

用紙: A4 / Letter / カスタムとメーカー非依存の汎用プリセット。ラベル寸法、行列、余白、間隔をmm / inchで設定できます。
要素: 固定テキスト、差し込みテキスト、ローカルPNG / JPEG / WebP画像、QRコード、Code 128 Set B、Code 39。
差し込み: UTF-8 / UTF-8 BOM / Shift_JISのCSV・TSV、ファイルのドラッグ＆ドロップ、表形式テキストの貼り付けに対応します。
使いかけ用紙: 1ページ目の使用済み位置を手動指定し、空き位置へデータ順を保って配置。2ページ目以降は新品シートとして扱います。
印刷補正: X/Yを0.1 mm単位で補正し、補正プリセットをブラウザ内へ保存できます。ラベル枠・中央マーク・位置番号付きの位置合わせPDFも生成できます。
出力: A4 / Letter / カスタム用紙の印刷用PDF。作業内容は画像と差し込みデータを含む.labelsheet.jsonとして端末へ保存・復元できます。
編集操作: Undo / Redo、複製、前面 / 背面、削除、スナップON/OFF、Alt+ドラッグで一時スナップ無効、キーボード微調整、スマホの固定アクションバーと長押しメニューに対応します。
実行時通信: CSPはconnect-src 'none'。実行時CDN、API、analytics、telemetry、外部フォントは使わず、CSV / TSV、画像、コード内容、PDF生成をブラウザ内で処理します。

制限・注意点

内蔵レイアウトはメーカー公式テンプレートではなく、メーカー名に依存しない汎用寸法プリセットです。印刷前に実際のラベル用紙寸法を確認してください。
印刷用PDFは見た目と位置精度を優先して約300 dpiでページを描画するため、PDF内テキストの検索・編集を目的としていません。
Code 128はSet Bの印字可能ASCII文字、Code 39は英大文字・数字・空白・対応記号が対象です。小さすぎるQRコードは印刷後に読み取りにくくなる場合があります。
画像入力はローカルPNG / JPEG / WebPです。SVG画像入力や外部画像URLには対応していません。
CSV / TSVと表貼り付けには対応しますが、v1.0.0ではXLSXやGoogle Sheetsの直接読み込みには対応していません。
使いかけ用紙の使用済み位置は手動指定です。カメラによる自動検出はありません。
アプリはPDFを生成しますが、プリンタードライバーやプリンター本体を制御しません。最終的な位置精度は給紙精度や印刷ダイアログの倍率にも影響されます。
非常に大きな用紙、多数の高解像度画像、大量の差し込みデータではブラウザメモリを多く使用します。.labelsheet.jsonには画像や差し込みデータが含まれる場合があるため、機密情報を含む場合は保管・共有に注意してください。

よくある質問

CSVや画像、ラベル内容はサーバーへ送信されますか？

いいえ。CSV / TSV解析、画像処理、QR・バーコード生成、ラベル編集、PDF生成はブラウザ内で行います。Web版では最初のHTML取得だけ通信が発生します。

使いかけのラベル用紙でも使えますか？

はい。1ページ目で既に剥がした位置を手動指定すると、その位置を避けて空きラベルへ差し込みデータを順番に配置します。2ページ目以降は新品シートとして扱います。

メーカーのラベル用紙テンプレートが入っていますか？

内蔵プリセットはメーカー名に依存しない汎用寸法です。公式テンプレートではないため、実際の用紙寸法を確認して必要ならカスタム設定してください。

QRコードやバーコードを差し込みできますか？

はい。CSV / TSVの列をQRコード、Code 128、Code 39などの要素へ割り当て、行ごとに内容を変えて出力できます。

印刷位置が少しずれる場合は調整できますか？

はい。位置合わせ用PDFを印刷して確認し、X/Yを0.1 mm単位で補正できます。補正値は名前付きプリセットとしてブラウザ内に保存できます。

.labelsheet.jsonには何が保存されますか？

用紙設定、ラベル要素、埋め込み画像、差し込みデータ、使用済み位置、出力設定を保存できます。画像や差し込みデータが含まれるため、機密情報を使う場合はファイルの保管・共有に注意してください。

オフライン版・ソースコード

生成済みの通常版dist/index.htmlは単一HTMLで、用紙設定、ラベル編集、CSV / TSV差し込み、画像、QR・バーコード生成、使いかけ位置、印刷補正、PDF生成、.labelsheet.jsonの保存・復元を実行時の外部通信なしで利用できます。

GitHubでソースを見る