自分用に作っていたWeb制作ツールを公開しました
普段の制作で使うちょっとした便利ツールを、PROMPT.のサイト上にまとめて公開しました。
正直に言うと、ここで公開しているもののほとんどは世の中にすでに優秀なツールが存在します。WebP変換もCSSジェネレーターも、検索すれば良いサイトがいくつも見つかります。
ただ、用途ごとに別々のサイトを行き来して、UIに慣れ直して……というのが地味に面倒で。「自分が使いやすい形でひとつにまとめておきたい」という、ほぼ自分用の動機で作り始めたものです。せっかくなら同じように感じている方にも使ってもらえたら、と公開する形にしました。
公開したツール一覧
| ツール名 | 用途 |
|---|---|
| Prompt Maker | ワイヤーフレーム・HTML/CSSの制作プロンプトをフォーム入力で自動生成 |
| WebP Converter | JPEG・PNG・GIF・BMPをWebPに一括変換、ZIP書き出し対応 |
| CSS Generator | clamp・box-shadow・gradient・border-radiusなどをブラウザで生成 |
| Color Palette Generator | 基準色から5種の配色ルールでパレットを生成、CSS変数で書き出し |
| Code Formatter | HTML・CSS・JS・JSON・PHPを自動判定して整形（Prettier採用） |
| Page Template Maker | HTMLを貼るだけでWordPress固定ページテンプレートを生成 |
意識したこと
ブラウザだけで完結
- すべての処理はブラウザ内で実行されます。画像をサーバーにアップロードする必要はありません。
- 会員登録・ログイン不要、もちろん無料です。
UIを揃える
- どのツールも同じデザイン・操作感に揃えました。一つ覚えれば他も迷わず使えます。
- 広告表示はありません。
Webデザイナー視点の地味な機能
- カラーパレットはCSS変数形式（
--color-primary: #xxx;）でコピーできます。 - Page Template Maker は WordPress の
page-{slug}.php用に出力します。 - 細かい挙動も、自分が普段の制作で「こうだと早い」と感じる方に寄せています。
使い方
下記の一覧ページから各ツールにアクセスできます。サイトのグローバルメニューからもいつでも開けます。