ワークスペース
レイヤー
請求書上のブロックを順に並べます。ドラッグで並べ替え、削除せずに非表示にし、テキスト・区切り・改ページを追加できます。
SimpleInvoice の機能をすべて解説
ブロックで組み立てるテンプレート、通貨と日付の書式設定エンジン、印刷ダイアログからの PDF 書き出し、共有リンク、そしてローカル保存。すべてを解説します。
Generate の作業画面
左にレイヤー、デザイン、書式、ラベル。中央に請求書。右に選択中のブロックと書き出し。Generate をクリックすると開く画面そのものです。
ワークスペース
書き出し
印刷ダイアログから PDF として保存し、持ち運び用に JSON を書き出すか、請求書を URL に含めた共有リンクをコピーします。
ワークスペース
デザイン
プリセットを選び、色、用紙、余白、角を整えます。ヘッダーのスタイルと明細表は、選択中のブロックで設定します。
ワークスペース
書式
通貨、区切り、小数、日付パターン、ロケール。金額と日付が取引先の慣習どおりに読めます。
ワークスペース
ラベル
文書の言語と印刷されるすべての語：請求書、請求先、数量、請求残高。取引先が別の言い回しを望むなら、そのラベルだけ書き換えます。
Generate でできること
各パネルはひとつの機能です。ブロック、デザイン、書式、ラベル、書き出し。エディターのスクリーンショットではありません。
ブロック
ブロックで組み立てるテンプレート
請求書はブロックの積み重ねです。ヘッダー、詳細情報、請求元・請求先、品目、合計、配送、お支払い情報、支払いリンク、備考、取引条件、自由テキスト、署名、区切り線、改ページ、フッター。Generate でそれぞれを表示・非表示、並べ替え、設定できます。
- 出発点となる 10 種類の標準プリセット。それぞれブロックとスタイルの組み合わせが異なります。
- ドラッグでブロックを並べ替え。不要なものは、内容を消さずに非表示にできます。
- 自由テキストと区切り線のブロックは、書類に必要なだけ追加できます。
- プリセットは画面下部のツールバーの「テンプレート」から切り替えられ、内容はそのまま残ります。テンプレートギャラリーをご覧ください。
書式
取引先に合わせた通貨の書式設定
通貨コードとロケールを選び、記号とコードのどちらで表示するか、記号をどちら側に置くかを決め、桁区切りと小数点の記号、そして小数点以下の桁数を設定します。
- 60 を超える ISO 通貨コードに対応し、通貨ごとに妥当な小数桁数を既定で設定します。
- 取引先が
1,234.56ではなく1.234,56を期待する場合は、区切り記号を上書きできます。 - 記号は金額の前にも後ろにも置け、スペースの有無も選べます。
€ 1.200,00でも1,200.00 EURでも。 - 請求書、請求先、数量、単価といったラベルは、使う言語や表現に合わせて自由に変更できます。
書式
取引先の慣習に合わせた日付の書式設定
発行日と支払期限は、同梱されたどのロケールでも date-fns のパターンに従って表示されます。同じ請求書が、ベルリンでもロンドンでも東京でも自然に読めます。
d MMMM yyyy、MM/dd/yyyy、dd.MM.yyyyなどのプリセット。独自のパターンを入力することもできます。- 入力と同時に今日の日付でプレビュー。不正なパターンは、書類に届く前に警告されます。
- 月名と曜日名は 25 のロケールに対応。英語やドイツ語から、ウクライナ語や日本語まで。
- 変更できる支払期限の候補が、ほかの日付と同じ書式で表示されます。
デザイン
色、用紙、間隔
Generate のデザインペイン：アクセント色と文字色、A4 または Letter の用紙、3 段階の余白、3 段階の文字サイズ、角のスタイル。書体は文書全体で Inter です。ヘッダーの帯やバー、表のスタイルは、選択中のブロックのインスペクターで設定します。
- アクセント色のパレットに加え、ブランドカラーを正確に指定できる 16 進数の入力欄。
- 品目の表は罫線、ストライプ、グリッド、線なしから。見出しは塗りつぶし、下線、装飾なしから選べます。
- ロゴは請求書のヘッダーでアップロードし、小・中・大からサイズを選べます。
- 内容に触れずに、密なレイアウトとゆったりしたレイアウトの間で調整できます。
書き出し
印刷ダイアログからの PDF 書き出し
キャンバスに表示されているレイアウトが、そのまま印刷されます。ページ区切りは明示的に制御され、長い品目の表は見出しを繰り返しながら続き、フッターは全ページに表示されます。必要ならページ番号も付けられます。
- ベクターのテキストと埋め込みフォント。PDF は小さく、検索できる状態のままです。
- A4 と US Letter に対応し、正しい用紙サイズが自動で設定されます。
- ファイル名は既定で請求書番号になります。例:
Invoice INV-0042.pdf。 - 代替経路が必要なブラウザーのために、専用の印刷ビューを用意しています。
このブロックを使うテンプレート: 時間単価の請求書, プロフォーマインボイス
書き出し
サーバーなしでリンクを共有
共有リンクは、請求書全体を圧縮して URL のフラグメントに収めます。どこにも保存されません。受け取った人は自分のブラウザーで開き、共有された書類をそのまま見られます。
#の後ろのフラグメントを、ブラウザーがサーバーに送ることはありません。- 受け取る側にもアカウントは不要です。リンクを開けば、そのまま読み取り専用ビューが表示されます。
- リンクよりファイルが便利な場面では、請求書 1 件分の JSON を書き出せます。
- エディターの現在の書類を置き換える前に、PDF か JSON ファイルを残しておきましょう。
このブロックを使うテンプレート: 請負請求書
すべてのブロックの解説
請求書はブロックの積み重ねです。それぞれを個別に非表示、並べ替え、設定できます。以下が全リストです。
ヘッダー
1 ページ目の上部に、ロゴ、書類のタイトル、そして必要なら請求書番号を表示します。配置は左寄せ、中央、左右分割から、ロゴのサイズは 3 段階から選べます。
- ロゴを表示
- ロゴのサイズ
- タイトルの文言
- 番号を表示
- 配置
詳細情報
請求書番号、発行日、支払期限、発行地、参照番号、発注番号を、キーと値のリストで表示します。使う項目だけを表示し、配置は行、グリッド、1 行のインラインから選べます。
- 表示する項目とその順序
- 行、グリッド、インラインの配置
請求元・請求先
自分の事業者情報と取引先の情報を、横並びまたは上下に並べて表示します。メール、電話、ウェブサイト、登録番号、そして相手に追加した任意の項目を、個別に表示・非表示できます。
- 横並びまたは上下
- メール
- 電話
- ウェブサイト
- 登録番号
- 追加項目
品目
明細行の表です。番号、単位、数量、単価、税、割引の各列を表示・非表示にでき、品目ごとに補足説明の行を追加し、表のスタイルを選べます。
- 列の表示
- 罫線、ストライプ、グリッド、線なし
- 塗りつぶし、下線、装飾なしの見出し
- 補足説明の行
合計
小計、割引、税ごとの内訳、入金済み、請求残高を表示します。合計を強調し、ボックスを右に寄せるか、ページいっぱいに広げるかを選べます。
- 小計
- 割引
- 税の内訳
- 入金済み
- 請求残高
- 強調
- 配置
配送
配送方法、金額、届け先住所 — EC の請求書で役立ちます。ラベル、方法、金額、住所は書類上で編集します。
- 配送方法
- 配送料
- 配送先住所
- ラベル
- フォントサイズ
- 文字色
- 配置
お支払い情報
銀行口座、IBAN、BIC、PayPal のアドレスなど、取引先が支払うために必要なキーと値の組み合わせを自由に並べられます。配置は行、グリッド、2 列から。
- 行、グリッド、2 列
支払いリンク
支払い URL を開く行動喚起ボタンです。例：「請求書を支払う →」。
- URL
- ボタンのテキスト
- ボタンのスタイル
- 背景
- 文字色
- 枠線
- 角の丸み
- 余白
- フォントサイズ
- 配置
備考
取引先への短いメッセージです。お礼の言葉、案件の参照情報、納品の詳細など。
- 内容は請求書の備考欄から取り込まれます
取引条件
支払期間、遅延時の取り扱い、受け付ける支払方法など、支払いに関する条件を記します。
- 内容は請求書の取引条件欄から取り込まれます
テキスト
見出しを任意で付けられる、自由記述の段落です。必要なだけ追加できます。案件の概要、作業範囲の記載、保証に関する注記など。
- 見出し
- 本文
- 繰り返し追加可能
署名
ラベル付きの署名欄と、任意の日付欄です。請負業者の書類や見積送り状で役立ちます。
- ラベル
- 日付を表示
区切り線
ブロックの間に置く細い罫線、または空白の間隔です。3 段階のサイズがあり、繰り返し追加できます。
- 線または空白
- 小、中、大
改ページ
改ページを強制するレイアウト用ブロックです。エディターではラベル付きの罫線として表示され、印刷には出ません。
- 前 / 後で改ページ
- 次と一緒に保つ
- ページ番号の扱い
フッター
全ページの下部に表示されるテキストです。法人の登記情報、ウェブサイト、お礼の言葉など。ページ番号は任意で付けられます。
- テキスト
- ページ番号
書式エンジン
金額と日付は、汎用テンプレートが必ず間違える部分です。以下が調整できる項目です。
- 通貨コードと表示形式
- リストにある ISO 4217 コードなら、どれでも使えます。表示は記号、短縮記号、コード、正式名称から選べます。
$1,200.00、USD 1,200.00、1,200.00 US dollarsのように。
- ロケールに基づく桁区切り
- 桁の区切り方と既定の区切り記号は、ロケールが決めます。
en-USなら1,234.56、deなら1.234,56、frなら1 234,56。数字は常にラテン数字なので、PDF はどこで開いても同じように読めます。
- 区切り記号の上書き
- 取引先の慣習がロケールの既定と異なる場合は、桁区切りにカンマ、ピリオド、スペース、細いスペース、アポストロフィを、小数点にピリオドまたはカンマを指定できます。
- 通貨ごとの小数桁数
- 既定は自動です。多くの通貨では 2 桁、円のような通貨では 0 桁、慣習が求める場合は 3 桁になります。0 から 4 の間で固定することもできます。
- 記号の位置とスペース
- ロケール既定の挙動とは無関係に、記号を金額の前後どちらに置くか、スペースを入れるかどうかを指定できます。
- 日付のパターンとロケール
MMMM d, yyyyやdd.MM.yyyyのような date-fns のパターンを、同梱された 25 のロケールのいずれかで表示します。入力と同時に検証されるため、壊れたパターンが PDF に届くことはありません。
- 数量の精度
- 数量は金額と同じロケールと区切り記号を使いながら、精度だけを個別に設定できます。自動 (小数第 4 位まで、末尾のゼロは省略) または固定です。
- 編集できるラベル
- 印字されるラベルはすべて — 請求書、発行日、請求先、品目、小計、請求残高など — 選んだ書類の言語に合わせて切り替わり、請求書の上で個別に変更もできます。他の言語の請求書は、この仕組みで作ります。