開発のツール一覧

開発カテゴリのツールを60件まとめました。入力したデータはサーバーに送信されず、ブラウザ内だけで処理されます。

• 正規表現テスター

  正規表現のパターンとテスト文字列を入力すると、マッチ箇所のハイライト表示・キャプチャグループの一覧・置換結果のプレビューができます。

• Chmodパーミッション計算機

  ファイルパーミッションをチェックボックス・8進数（755等）・シンボル表記（rwxr-xr-x等）で相互変換します。setuid/setgid/スティッキービットにも対応。

• CIDR/サブネット計算機

  CIDR表記やIPアドレス+サブネットマスクから、ネットワークアドレス・ブロードキャストアドレス・利用可能ホスト数を計算します。

• キーコード（e.code/e.key）チェッカー

  押したキーのevent.key・event.code・keyCode・location・修飾キーの状態をリアルタイムで表示します。JavaScriptのキーボードイベント実装時の値確認に便利。

• スクリーンサイズ・Viewportチェッカー

  ビューポートサイズ・ウィンドウサイズ・画面解像度・デバイスピクセル比・Tailwind CSSのブレークポイントをリアルタイムで表示します。レスポンシブデザインの確認に便利。

• JSON Path / JSON Pointerテスター

  JSONPathやJSON Pointer（RFC 6901）のクエリを入力すると、マッチした値と絶対パスを一覧表示します。APIレスポンスから値を取り出すクエリの動作確認に便利。

• 進数変換（2/8/10/16進）

  2進数・8進数・10進数・16進数の数値をリアルタイムに相互変換します。0x/0b/0oプレフィックスや負数にも対応。

• CSSグラデーションジェネレーター

  カラーストップと角度・形状を指定して、線形/円形のCSSグラデーションをプレビューしながら生成します。

• CSS clip-pathジェネレーター

  頂点をドラッグして多角形・円・楕円・insetのclip-pathを作成。三角形・星・吹き出しなどのプリセット付き。

• CSS box-shadowジェネレーター

  オフセット・ぼかし・広がり・色・insetを調整して、複数レイヤーのCSS box-shadowをプレビューしながら生成します。

• CSS border-radiusジェネレーター

  4つの角の丸みをそれぞれ調整して、CSSのborder-radiusをプレビューしながら生成します。px/%の単位切り替えにも対応。

• px⇔rem変換

  pxとremの値をリアルタイムに相互変換します。ベースフォントサイズを自由に指定可能。

• metaタグ・OGPタグ生成

  タイトル・説明文・URL・画像から、基本metaタグ・OGP・Twitter Cardのタグをまとめて生成します。SNSシェア時のプレビュー確認付き。

• cURL→Fetch/Axios変換

  curlコマンドをfetch・axiosのJavaScriptコードに変換します。ヘッダー・JSONボディ・フォーム・Basic認証に対応し、通信は行わず解析のみ。

• HTTPヘッダー解析・セキュリティ診断

  貼り付けたレスポンスヘッダーから、HSTS・CSP・Cookie属性などの不足や弱い設定を診断。nginx・Apache・_headers 形式の推奨設定も生成します。

• CSS clamp()計算機

  最小・最大フォントサイズと画面幅から、流動タイポグラフィ用のclamp()式を自動計算します。

• CSS Flexbox/Gridジェネレーター

  方向・揃え・間隔・列数を選ぶだけで、FlexboxとGridのCSSをプレビューしながら生成します。

• Unicodeコードポイント検索

  文字のコードポイント・UTF-8/UTF-16バイト列・カテゴリを調べ、U+XXXXから文字を逆引き

• URLパーサー・クエリ編集

  URLをプロトコル・ホスト・パス・クエリ・ハッシュに分解し、パラメータを編集して再組み立て

• User-Agent解析

  User-Agent文字列からブラウザ・OS・レンダリングエンジン・デバイス種別を判定。いま使っているブラウザのUAも自動表示します。

• CSS text-shadowジェネレーター

  オフセット・ぼかし・色を調整して、複数レイヤーのCSS text-shadowをプレビューしながら生成します。ネオン・縁取りなどのプリセット付き。

• CSSグラスモーフィズム・ニューモーフィズムジェネレーター

  すりガラス風（backdrop-filter）と凹凸のあるニューモーフィズム（多層box-shadow）のCSSを、質感プリセットとプレビュー付きで生成します。

• CSSアニメーションジェネレーター

  バウンス・フェード・回転などのプリセットから、@keyframesとanimationをイージング編集・プレビュー付きで生成します。prefers-reduced-motion対応も出力できます。

• HTTPステータスコード一覧・検索

  404・301・500・429 など HTTPステータスコードの意味・原因・対処をコード番号や名称、キーワードで検索できる一覧表です。

• MIMEタイプ検索

  拡張子からMIMEタイプ（Content-Type）を、MIMEタイプから拡張子を調べられます。画像・音声・動画・文書・フォントなどを収録し、部分一致検索にも対応

• robots.txt生成

  User-agent別のAllow/Disallow、Sitemap、AIボットのブロックに対応したrobots.txtを生成

• sitemap.xml生成（URL一覧から）

  URL一覧を貼り付けてsitemap.xmlを生成。lastmod・changefreq・priorityの一括付与、無効URLと重複の除外、50,000件超の分割に対応

• .htaccess生成（リダイレクト・HTTPS強制・www統一）

  HTTPS強制・www有無の統一・個別URLの301/302リダイレクト・エラーページ指定の.htaccessを生成。ループの警告と確認手順つき

• IPアドレス変換

  IPv4を10進整数・16進・2進に相互変換し、IPv6の短縮・展開・完全展開表記にそろえます。入力形式は自動判別。

• セマンティックバージョン比較・範囲判定

  semverのバージョン比較・ソートと、^ ~ >= || x ハイフン範囲の適合判定。prereleaseにも対応

• JSON-LD構造化データ生成

  FAQ・記事・商品・パンくずリストのJSON-LD構造化データをフォームから生成し、scriptタグごとコピーできます。

• UTMビルダー（UTMパラメータ付きURL作成）

  広告・メルマガ・SNS用にUTMパラメータ付きURLを作成。プリセット・複数URLの一括生成・履歴に対応

• .htpasswd生成（Basic認証・bcrypt/SHA-1）

  Basic認証用の.htpasswdをbcrypt/SHA-1で生成。複数ユーザーとAuthorizationヘッダーの出力にも対応

• nginxリダイレクト設定生成

  HTTPS強制・www統一・末尾スラッシュ・個別URLの301/302をnginxのserverブロック断片で生成

• ポート番号一覧・検索

  22・80・443・3306 など主要なポート番号を、番号・範囲・サービス名で検索。TCP/UDP の区別と用途つき。

• HTMLテーブル生成

  行数・列数を指定してHTMLのtableタグを作成。セル結合（colspan・rowspan）、見出し行（thead）、罫線・縞模様のCSS付き出力とプレビューに対応。

• 日付フォーマット文字列ビルダー

  例文から strftime・Java・PHP・Day.js/Moment.js・.NET の日付書式文字列を生成し、相互変換します。

• 正規表現パターン集

  郵便番号・電話番号・メール・全角カタカナ・日付・IPアドレスなど、よく使う正規表現をコピーして使えるパターン集。一致／不一致の例つき。

• ビット演算計算機

  AND・OR・XOR・NOT・シフト・ローテートを8/16/32/64bitで計算。結果を2進・10進・16進で並べ、ビットごとに可視化。2の補数にも対応。

• 浮動小数点（IEEE 754）ビット表示

  数値をfloat32・float64の符号・指数部・仮数部のビット列と16進に変換。逆変換や0.1+0.2の誤差確認、NaN・Infinity・非正規化数にも対応。

• クリップボード内容確認

  貼り付けたクリップボードのMIME種別・HTMLソース・画像・ファイルを一覧表示

• Snowflake ID・ObjectID・UUID生成時刻デコード

  Snowflake ID・MongoDB ObjectID・UUID v1/v6/v7・ULIDから生成時刻と構成要素を読み取る。複数行の一括デコード対応

• OSSライセンス文生成

  MIT・Apache-2.0・BSDなどのライセンス文を著作者名と年つきで生成。SPDX識別子と比較表つき。

• ディレクトリツリー図作成

  インデントや箇条書きで書いたフォルダ構成を、READMEに貼れる├──└──のツリー図に変換。コメント桁揃え・深さ折りたたみ・逆変換対応。

• CSS filterジェネレーター

  blur・brightness・contrast・grayscale・hue-rotate・drop-shadowなどのCSS filterをスライダーで調整し、プレビューしながらコードを生成。

• CSS transformジェネレーター

  移動・回転・拡大縮小・傾き・3D回転・perspective・transform-originを調整して、CSS transformをプレビューしながら生成します。

• CSS詳細度計算機

  CSSセレクタの詳細度(a, b, c)を1行ずつ計算し、複数のセレクタを比較してどれが優先されるか判定します。

• CSSボタン・トグルスイッチ・三角形ジェネレーター

  ボタン・JS不要のトグルスイッチ・三角形・矢印のHTMLとCSSを、テーマ色・角丸・ホバー効果を指定してプレビュー付きで生成します。

• CSSパターン背景ジェネレーター

  ストライプ・ドット・チェック柄の背景をCSSグラデーションやSVGで生成し、プレビューしてコピー。

• mailto・tel・SMSリンク生成

  件名・本文・CC/BCC付きのmailto、telリンク、SMSリンクを生成。URLエンコード済みのhrefとHTMLアンカーをコピーできる。

• CSSカラー名一覧

  CSSで使える色名キーワード148色（red・tomato・rebeccapurple など）をHEX・RGBつきで一覧表示。名前やカラーコードで検索し、クリックでコピーできます。

• HTMLエンティティ一覧

  © などHTMLの文字参照を名前・10進・16進の数値参照つきで一覧表示。検索してコピーできる。

• Cron式ジェネレーター

  分・時・日・月・曜日をGUIで選んでcron式を作成。*/5の間隔・範囲・列挙、Quartz形式にも対応します。

• ISO 8601 期間（duration）変換

  ISO 8601の期間（PT1H30M、P1Y2M3D、P2Wなど）を秒・分・時間・日に変換します。秒数からの逆変換や、基準日時への加算にも対応。

• Cookie解析（Cookie・Set-Cookie分解）

  CookieヘッダーやSet-Cookieを名前・値・Domain・Path・Expires・Max-Age・Secure・HttpOnly・SameSiteに分解して表示。設定ミスも指摘。値は初期状態でマスク表示します。

• umask計算機

  umask値から新規ファイル・ディレクトリの実効パーミッションを算出。欲しいパーミッションからのumask逆算にも対応。

• docker run→docker-compose変換

  docker runコマンドをdocker-compose.ymlに変換します。ポート・ボリューム・環境変数・--name・--restartなど主要オプションに対応し、未対応オプションは警告表示。

• 正規表現の解説（パターン分解）

  正規表現のパターンを文字クラス・量指定子・グループ・先読み・後読み・アンカー・フラグに分解して日本語で解説。不正なパターンはエラー位置つきで表示。

• CSS単位換算ツール

  px・rem・em・vw・vh・vmin・ch・ptなどCSS単位を画面幅や親フォントサイズを指定して一括換算

• Fetch/Axios→cURL変換

  fetch・axiosのJavaScriptコードをcurlコマンドに変換します。method・headers・JSONボディ・FormDataに対応し、コードは実行せず解析のみ。