ロゴプレースホルダー生成ツール

ブラウザー内でローカル実行

モックアップやプロトタイプ用のプレースホルダーロゴを再現可能なシードで生成

任意の文字で最大 64 文字。

同じブランド、シード、オプションなら常に同じロゴになります。

ロゴ設定

ブランド

モノグラムスタイルで使用します。最大 4 文字。

マーク
スタイル
形状
余白(セーフエリア)
シンボルの複雑さ
カラー
カラーモード

モックアップやプロトタイプ向けのオリジナルな手続き型プレースホルダーであり、完成したブランドアイデンティティではありません。

ロゴのプレビュー

バリエーション
Lumen Forge の横組みロックアッププレースホルダーロゴ
プレビューの背景

背景はこのプレビューのみに影響し、書き出すファイルには影響しません。

<svg xmlns="http://www.w3.org/2000/svg" width="494" height="128" viewBox="0 0 494 128" role="img" aria-labelledby="lpg-1n5vbfo-title lpg-1n5vbfo-desc"><title id="lpg-1n5vbfo-title">Lumen Forge</title><desc id="lpg-1n5vbfo-desc">Fictional placeholder logo for mockups (geometric style, horizontal lockup).</desc><defs><mask id="lpg-1n5vbfo-cut" maskUnits="userSpaceOnUse" x="-5" y="-5" width="110" height="110"><rect x="-5" y="-5" width="110" height="110" fill="#fff"/><path d="M63.24 85.17 L21.41 72.92 L33.66 31.09 L75.49 43.34 Z M61.71 82.36 L24.22 71.38 L35.2 33.89 L72.68 44.87 Z" fill-rule="evenodd" fill="#000"/><path d="M65.17 75.23 L31.35 74.85 L31.73 41.02 L65.56 41.4 Z M62.94 72.94 L33.64 72.61 L33.97 43.31 L63.27 43.64 Z" fill-rule="evenodd" fill="#000"/></mask></defs><g transform="translate(20 20) scale(0.88)"><g mask="url(#lpg-1n5vbfo-cut)"><polygon points="48.45,58.13 50,4 96,50" fill="#cd5e23"/><polygon points="48.45,58.13 96,50 50,96" fill="#1f3bdb"/><polygon points="48.45,58.13 50,96 4,50" fill="#cd5e23"/><polygon points="48.45,58.13 4,50 50,4" fill="#1f3bdb"/></g></g><text x="302" y="82" fill="#2e211a" font-family="system-ui, -apple-system, 'Segoe UI', Roboto, 'Noto Sans', Arial, sans-serif" font-size="50" font-weight="700" text-anchor="middle" textLength="344" lengthAdjust="spacingAndGlyphs">Lumen Forge</text></svg>

テキストにはシステムフォントが使われるため、端末によって字形がわずかに異なる場合があります。テキストは固定幅に合わせて調整されるため、切れることはありません。

ロゴプレースホルダー生成ツールとは

モックアップ、プロトタイプ、デモ、スクリーンショット、シードデータ向けに、架空のプレースホルダーロゴを作成します。すべてのマークは、ブラウザー上で幾何学図形から組み立てられるオリジナルの手続き型デザインです。既存のロゴを複製することはなく、プロのロゴデザインサービスでもありません。

使い方
  1. 1.ブランド名を入力し、モノグラムスタイルを使う場合はイニシャルも入力します。
  2. 2.7 つのスタイルから選び、シンボルの複雑さ、形状、カラーモードを調整します。
  3. 3.バリエーションを選びます: アイコンマーク、ワードマーク、横組みロックアップ、縦組みロックアップ、モノクロ。
  4. 4.SVG マークアップまたは JSX コンポーネントをコピーするか、SVG をダウンロード、PNG を書き出します。
決定的なシード

ブランド名、シード、すべてのオプションが安定したキーに結合されるため、同じ入力なら常にバイト単位で同一の SVG が生成されます。「新しいシード」で別のマークを探し、「前のシード」で気に入ったものに戻れます。

出力に関する注意

SVG ファイルは自己完結型で、スクリプト、外部フォント、画像を含みません。ブランド名はシステムフォントの実際の SVG テキストのままなので、端末によって見た目がわずかに異なる場合があります。PNG の書き出しはブラウザーが描画した内容を取得します。すべてローカルで実行され、何もアップロードされません。

CodingToolが正式に公開されました

Launched on StartupBaseCodingTool.dev - Free, Fast & Easy Developer Tools in One Place | Product HuntCodingTool - Featured on Startup FameFazier badgeListed on Turbo0Featured on Twelve ToolsFeatured on Findly.tools