CSS Grid Generator

グリッドレイアウトをビジュアルで組み立て・レイアウト定義をファイル保存

━━━━━━━━━━━━━━━━━━━━━━━━

■ 概要

列数・行数・ギャップをスライダーで設定し、セルをクリックしてスパンを指定するだけで CSS Grid コードが自動生成されます。Holy Grail・12カラムなどのプリセット付き。

生成した CSS・HTML スケルトンをワンクリックでコピーできます。インターネット接続不要。入力データは外部に一切送信されません。

━━━━━━━━━━━━━━━━━━━━━━━━

■ 主な機能

✓ 列数・行数（1〜12）・column-gap・row-gap をスライダーで設定

✓ セルをクリックして選択し、スパン列数・行数を UI 指定

✓ CSS Grid コード（grid-template-columns / grid-column 等）をリアルタイム生成

✓ Holy Grail・12カラム・カード3列などのプリセット収録

✓ CSS・HTML スケルトンをワンクリックでコピー

✓ 【デスクトップ限定】レイアウト定義を JSON ファイルとして保存・読み込み

✓ 【デスクトップ限定】最近開いたファイル履歴（最大10件）

━━━━━━━━━━━━━━━━━━━━━━━━

■ 収録ファイル

・ CSS-Grid-Generator_1.0.0_x64-setup.exe（インストーラー版）

・ README.txt

━━━━━━━━━━━━━━━━━━━━━━━━

■ 動作環境

・ Windows 10 / 11（64bit）

・ Microsoft Edge WebView2 ランタイム（Windows 11 は標準搭載）

━━━━━━━━━━━━━━━━━━━━━━━━

■ 注意事項

・初回起動時に Windows スマートスクリーンの警告が出る場合があります。「詳細情報」→「実行」でご利用ください。

・本ツールの使用によって生じた損害について作者は責任を負いません。