type-forge · 3D text generator
Three.js + WebGL でブラウザだけで動く 3D テキスト ジェネレーター。 文字を入力 → 押し出し / 面取り / 5 種の材質 / 環境光 / 背景を切り替え → ドラッグで回転 → PNG 1080×1080 でダウンロード。 アップロード不要、 サインアップ不要、 入力はサーバーに送信されません。
[ ./how_it_works ]
step / 01
1〜12 文字程度のアルファベットや数字を入力。 helvetiker / optimer / gentilis の 3 フォントから選べる (英数字のみ対応)。
step / 02
マット / 金属 / クロム / ネオン光 / ガラス の 5 種から材質を選択し、 押し出し深さ / 面取り / カラー / 背景 (鍛冶 / スタジオ / 夜空 / 透明) を調整。 すべてリアルタイムにプレビュー。
step / 03
プレビューをドラッグで回転、 スクロールでズーム。 自動回転の ON/OFF も切替可。 完成したら 「PNG 1080×1080 で取り出す」 でダウンロード。 SNS アイコンや バナー / プレゼン素材 にそのまま使えるサイズです。
[ ./faq ]
WebGL を扱う JavaScript ライブラリです。 本ツールは Three.js の TextGeometry (フォントから 3D 押し出しメッシュを生成) + OrbitControls (ドラッグで回転) + MeshStandardMaterial / MeshPhysicalMaterial (PBR 材質) + ACES Filmic トーンマッピング でリアルタイムに描画しています。 全部ブラウザ内処理、 サーバーは一切経由しません。
v1 では英数字のみ対応です。 同梱しているフォント (helvetiker / optimer / gentilis) は欧文フォントで、 日本語グリフを含んでいません。 日本語対応 (Noto Sans JP / モリサワ 等の Typeface 化) は容量が大きい (1 フォント ~10MB) ので IMPROVE で検討中。 今は英字ロゴ / ブランド名 / イニシャル 用途で使ってください。
v1 では 1080×1080 固定 (SNS のアイコン / バナー で使い回しやすいサイズ)。 4K / 任意比率 / SVG vector 出力 は IMPROVE 候補。 透明背景 PNG にしたい時は背景 = 「透明 (PNG)」 を選んでください。
(1) マット = roughness 高めの普通の塗装。 (2) 金属 = metalness + roughness で金色 / 銀色 ぽい鏡面。 (3) クロム = metalness 1.0 で完全鏡面。 (4) ネオン光 = emissive を上げてグロー。 (5) ガラス = MeshPhysicalMaterial の transmission + ior 1.45 で半透明。 ネオン / ガラスは暗い背景 (夜空) との相性が良いです。
送られません。 Three.js のシーン構築・レンダリング・PNG エンコード はすべてブラウザ内で完結します。 サインアップ不要、 ログイン不要、 ファイルアップロード不要。 フォントだけ ai-lab.org の /fonts/ から読み込みます (typeface.json、 オフライン対応のため CDN ではなく自前配信)。
ai-lab.org の ジェネレーター thesis 枠の 1本目です (charter 8 thesis 枠で初)。 計算ツール (CoinStack / RoofFund)、 占い (FateNum)、 データ可視化 (WikiOrbit)、 on-device ML 14本 とは別 thesis。 今後ジェネレーター系は AI 短歌 / 配色パレット / SVG モノグラム などを増やしていく予定。