🚀 クイックスタート

初めての方は、以下の手順で素早くテンプレートを作成できます。
  1. ページ設定で「A4・縦向き・4枚」を選択
  2. 背景設定で背景タイプを選択（なし/単色/画像）
  3. 表示項目で必要な項目にチェック
  4. 右側のプレビューを確認して「HTMLダウンロード」
💡 迷った場合は「おすすめ設定」を適用してから調整してください。

📐 ページ設定

印刷する用紙のサイズと、1ページに配置するカード数を設定します。
💡 印刷する用紙のサイズを選択してください。一般的にはA4サイズが推奨です。
💡 用紙の向きを選択します。首からかける名札は縦向きが一般的です。
💡 1枚の用紙に何枚のカードを配置するか選択します。コスト削減には複数枚がおすすめです。
HTMLダウンロード時のデフォルトファイル名（拡張子なし）

🖼️ 背景設定

カードの背景を設定します。単色、グラデーション、または画像を使用できます。
💡 カードの背景を選択します。企業ロゴや展示会デザインに合わせて画像を設定することもできます。

🔄 画像形式変換ツール

AI生成画像やベクター画像をPNG形式に変換できます。変換後の画像は背景やダウンロードに使用できます。

💡 対応形式：
✅ AI生成画像（WebP, JPEG, PNG）
✅ ベクター画像（SVG）
✅ その他のラスター画像（GIF, BMP等）

📝 注意： Adobe Illustrator (.ai) ファイルは、先にSVG形式で保存してから変換してください。
WebP, JPEG, SVG, GIF, BMP等を選択してPNGに変換

🔄 背景プレビュー更新

背景設定を変更した後、このボタンをクリックすると確実にプレビューに反映されます

📝 表示項目

カードに表示する項目を選択します。各項目のフォントサイズと表示順序をカスタマイズできます。

✏️ カスタムテキスト設定

カード内に自由なテキストを追加できます。内容、位置、サイズ、色を設定できます。
💡 複数カードの場合は、各カードタブ内で個別に設定できます。

✏️ カスタムテキスト設定2

カード内に2つ目の自由なテキストを追加できます。内容、位置、サイズ、色を設定できます。
💡 複数カードの場合は、各カードタブ内で個別に設定できます。

🎨 スタイル設定

テキストの見た目や配置を設定します。フォント、色、サイズなどをカスタマイズできます。
💡 カード全体のフォントを選択します。Noto Sans JPは視認性が高く、名札に最適です。
💡 テキストを左・中央・右のどこに配置するか選択します。中央配置がバランス良く見やすいです。
💡 カード内の要素を縦方向でどう配置するか選択します。中央が一般的です。
💡 カード全体のテキスト色を設定します。黒または濃いグレーが読みやすくおすすめです。
💡 氏名の後に「様」を付けて表示します。チェックを外すと氏名のみ表示されます。
💡 0を指定すると氏名と同じサイズになります。個別にサイズを指定する場合は数値を入力してください。
💡 QRコードの大きさを設定します。120px程度が読み取りやすくおすすめです。
カードの上部に表示されるテキスト（空欄の場合は表示されません）改行はEnterキーで可能です
💡 ヘッダーはカードの最上部に固定配置されます。高さを指定できます。
カードの下部に表示されるテキスト（空欄の場合は表示されません）
💡 フッターはカードの最下部に固定配置されます。高さを指定できます。

📏 余白・間隔設定

カード内の余白や要素間の間隔を細かく調整できます。見やすさに影響する重要な設定です。
💡 カードの端からコンテンツまでの余白です。20px程度が標準的です。
💡 各項目（会社名、氏名など）の間隔です。10px程度が見やすいです。
💡 QRコードの上部の間隔です。他の項目と独立して調整できます。
💡 QRコードの下部の間隔です。他の項目と独立して調整できます。

🔀 条件設定（高度な機能）

上級者向け： 参加者の属性や業種に応じて、背景画像や色帯を自動的に切り替えることができます。
例：VIP参加者には専用の背景デザインを、業種ごとに異なる色の帯を表示するなど
この機能を使用しない場合は、チェックボックスをオフのままにしてください。
💡 背景画像とは別に、条件に応じて表示される画像を配置できます。座標を指定して任意の位置に配置可能です。
💡 特定の条件を満たす場合のみカスタムテキストを表示できます
💡 特定の条件を満たす場合のみ、特定の表示項目を表示できます（例：備考2に「懇親会」とある人だけ「カスタム項目」を表示）
📋 操作手順
  1. テンプレート生成： 設定内容をプレビューに反映します
  2. HTMLダウンロード： 完成したテンプレートをファイルとして保存します
  3. 印刷： プレビュー画面を印刷します（テスト用）

📝 テストデータ

プレビュー表示用のサンプルデータです。実際の入場証には参加者のデータが自動的に反映されます。
ここで入力したデータはプレビュー確認用です。実際のHTMLテンプレートには変数として埋め込まれます。

👁️ プレビュー

設定したデザインをリアルタイムで確認できます

自動反映中 最終更新: 未更新
表示倍率： 100%