Fast Text Format Tools
フォーマット、変換、およびワークフローの合理化を行う、超高速ユーティリティの究極のコレクション。
お気に入り
最近使用したツール
最近追加されたツール
テキストとツール
大文字小文字&コンバーター
文字列の大文字小文字の変換、URLエンコード、Base64のデコードを即座に行います。
エンコーダー / デコーダー
URL、Base64、HTMLエンティティなどのさまざまな形式をエンコードおよびデコードします。
リストソーター&重複削除
テキスト配列をアルファベット順、数値順、または長さ順に瞬時に並べ替え、重複行を削除します。
正規表現置換
正規表現を実行し、ライブマッチを確認し、チートシートを使用します。
テキスト差分
2つのテキストブロックを並べて比較し、違いを強調表示します。
テキスト統計
単語、文字、文をカウントし、読書時間を推定し、キーワード密度を確認します。
翻訳機
数十の言語間でテキストを即座に翻訳します。
コードとフォーマット
Base64 からファイルへ
Base64 文字列や Data URI を、ダウンロード可能なファイル(画像、PDF、ドキュメント、音声)に即座にデコード・プレビューします。
コード美化
JSON、JavaScript、CSS、HTMLコードを美化、検証、圧縮して整理された読みやすい構文にします。
CSS フォーマット
カスタムインデントで CSS スタイルシートを整形、美化、検証、圧縮します。
CSS ビジュアルジェネレーター
ボックスシャドウ、グラデーション、Flexbox、Grid レイアウトの CSS コードを視覚的に生成してエクスポートします。
CSV から JSON/SQL
CSVデータをJSON配列またはSQL INSERT文に変換します。
cURL から Fetch
cURLコマンドをJavaScript Fetch APIコードに簡単に変換します。
HTML / XML
乱雑なコードを即座に整形、圧縮、クリーンアップします。
HTML から JSX への変換
HTML タグと属性を React 互換の JSX に変換するクライアント側ツール。
HTML から Tailwind CSS への変換
標準のインラインスタイルや CSS 宣言を、プレビュー付きで Tailwind CSS ユーティリティクラスに変換します。
JS 難読化ツール
読みやすい JavaScript コードを難読化および圧縮されたコードに変換し、ロジックを保護します。
JSON から コード
JSONオブジェクトをさまざまな言語の型付きモデルに変換します。
JSON ツリービューアー
複雑な JSON データを視覚的に展開、折りたたみ、検索、フィルタリングし、パスを簡単に検査できます。
Markdown
ライブHTMLプレビューを使用して生のマークダウンを記述します。
Source Map ビューア
クライアント側で .map ファイルをアップロードし、スタックトレースを復元・逆最小化するツール。
SQL フォーマッター
乱雑なSQLクエリを美化し、フォーマットします。
文字列のエスケープとアンエスケープ
JSON 文字列、SQL クエリ、HTML、Java/C# 向けに、引用符、バックスラッシュ、改行を安全にエスケープ(および復元)します。
SVG オプティマイザー
生のSVGコードを圧縮およびクリーンアップします。
SVG を PNG/WEBP に変換
HTML Canvas を利用して SVG コードまたはファイルをダウンロード可能な画像にラスタライズするクライアント側ツール。
XML ユーティリティ
XML文字列のフォーマットと圧縮を行います。
YAML <-> JSON
YAMLとJSONを瞬時に変換します。
データと暗号
Bcrypt ハッシュ
Bcryptパスワードをローカルで生成および検証します。
エポックタイム
タイムスタンプを人間が読める日付に変換します。
ハッシュ ジェネレーター
MD5、SHA-1、SHA-256、SHA-512の暗号化ハッシュを計算します。
JWT デコーダー
JSON Web Token をフォーマットされたヘッダーおよびペイロードデータに安全に解析します。
HMAC ジェネレーター
SHA-256、SHA-512、MD5、および秘密鍵を使用して、暗号化HMAC署名を計算および検証します。
ジェネレーター
ASCII アート
巨大なアスキーアートテキストバナーを生成します。
バーコードジェネレーター
テキストから線形バーコード(UPC、EAN、Code39)を Canvas で生成するクライアント側ツール。
CHMOD 計算機
Linuxファイルの権限を簡単に計算します。
カラーコントラスト
WCAG カラーコントラストのアクセシビリティを確認します。
カラーフォーマット
HEX、RGB、HSLのカラーコードを即座に変換します。
Cron デコーダー
cronスケジュールを人間が読めるテキストに翻訳します。
ファビコンジェネレーター
通常の画像を汎用互換性のある.icoファイルに変換し、標準的なWebアプリアイコンサイズを生成します。
画像 Base64
画像ファイルを Base64 Data URI 文字列および CSS background-image プロパティに変換します。
画像圧縮ツール
ブラウザ内で JPEG、PNG、WEBP、AVIF 画像をローカルに圧縮・最適化します。
マークダウンテーブルジェネレーター
ユーザーが簡単に行/列を追加し、完全にフォーマットされた Markdown テーブル構文を即座に出力できるビジュアル グリッド エディター。
メタタグ&Open Graphジェネレーター
SEOメタタグ、Twitterカード、Facebook Open Graphタグを生成し、視覚的にプレビューします。
モックデータジェネレーター
数百行の偽のテスト データ (名前、電子メール、住所、日付、クレジット カード) を生成し、データベース テスト用に CSV、JSON、または SQL INSERT ステートメントとしてエクスポートします。
パスワード生成ツール
暗号化アルゴリズムを使用して強力で安全なパスワードを作成します。
PDFツールキット
ブラウザ内で100%安全かつローカルにPDFページの結合、分割、抽出、回転、並べ替えを行います。
プレースホルダーテキスト
UIモックアップ用にランダムなプレースホルダーテキストを作成します。
QR コード
テキストまたはURLから、スケーラブルでスキャン可能なQRコードを作成します。
正規表現テスターと正規表現ビルダー
リアルタイムの一致およびキャプチャ グループのハイライト表示、構文説明の内訳、および複数文字列テスト モードを使用して正規表現をテストします。
Robots.txt ジェネレーター
有効なrobots.txtルールとクローラーディレクティブを作成し、AIスクレイパーをブロックします。
UUID / GUID
汎用一意識別子 (v4) を即座に生成します。
XMLサイトマップジェネレーター
検索エンジン向けにカスタムURL、更新頻度、優先度を指定した有効なXMLサイトマップを構築します。
金融と単位
ネットワーク
DNS 検索
リアルタイムでDNSレコードを確認します。
HTTP ヘッダービューアー
ブラウザが送信するHTTPリクエストヘッダーを表示します。
インターネット速度テスト
ダウンロードおよびアップロードの接続速度をテストします。
IP 検索
IPアドレスとジオロケーションデータを検索します。
MAC ベンダー検索
MACアドレスからハードウェアベンダーを特定します。
RDAP 検索
RDAP 経由でドメインおよび IP の登録情報、レジストラ、ネームサーバー、DNSSEC 状態を照会。
リダイレクト&リンクトレース
短縮URLの隠れたリンク先を暴き、HTTP 301/302リダイレクトチェーン全体を最終目的地まで追跡します。
SSL 証明書チェッカー
任意のドメインのライブ SSL/TLS 証明書、発行者チェーン、有効期限カウントダウン、SAN ドメイン、フィンガープリントを検査。
サブネット計算機
CIDRネットワークマスクとIP範囲を計算します。
URL パーサー
URLクエリ文字列を簡単に抽出および構築します。
User-Agent 解析
User-Agent文字列からOSとブラウザ情報を抽出します。
Webhook テスター
カスタムヘッダー、HMAC署名、およびライブレスポンス検査を使用してWebhook配信を送信、テスト、デバッグします。
CSS ビジュアルジェネレーター
ボックスシャドウ、グラデーション、Flexbox、Grid レイアウトの CSS コードを視覚的に生成してエクスポートします。
box-shadow: 0px 10px 25px -5px rgba(0, 0, 0, 0.25);background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);Click any item in the preview to select and inspect its properties.
.flex-container {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: 16px;
}.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 16px;
}使い方
ジェネレーターモード(ボックスシャドウ、グラデーション、Flexbox、Grid レイアウト)を選択します。スライダーで視覚的に調整し、生成された CSS をコピーまたはエクスポートします。
よくある質問
CSS ボックス シャドウはどのように機能し、各パラメーターは何を意味しますか?
CSS の box-shadow プロパティは、要素フレームに 1 つ以上のドロップシャドウを付加します。パラメーターは、水平オフセット (X)、垂直オフセット (Y)、ぼかし半径 (影のエッジがどの程度柔らかくまたは拡散して表示されるか)、拡散半径 (影がどの程度拡大または縮小するか)、影の色 (通常は半透明の rgba)、およびコンテナー内に影をレンダリングするためのオプションの 'inset' キーワードを指定します。
リアルな UI シャドウに複数のボックス シャドウ レイヤーを使用する必要があるのはなぜですか?
現実世界の影は、周囲環境光と直接指向性光の両方で構成されます。タイトで少し暗いシャドウと、広がりのある柔らかく不透明度の低いシャドウを重ねると、濁ったり人工的に見えることなく、自然な高さと奥行きが生まれます。
CSS の線形グラデーションと放射状グラデーションの違いは何ですか?
線形グラデーションは、度またはキーワード (例: 135 度または「右下へ」) で定義された直線の方向軸に沿って色を遷移します。放射状のグラデーションは、単一の原点から円形または楕円形のパターンで外側に現れ、スポットライトまたは球形の色の遷移を作成します。
CSS フレックスボックスと CSS グリッドのどちらを使用すべきですか?
Flexbox は、項目 (ナビゲーション バー、ボタン グループ、ツールバーの配置など) を単一の行または列に整理するのに最適な 1 次元レイアウト システムです。 CSS グリッドは、複雑な Web ページ構造、複数列のダッシュボード レイアウト、厳密なグリッド配置向けに設計された 2 次元レイアウト システムです。
Flexbox の justify-content と align-items の違いは何ですか?
justify-content は、主軸 (flex-direction が行の場合は水平、列の場合は垂直) に沿ったフレックス項目の分布を制御します。 align-items は、交差軸 (主軸に垂直) に沿った項目の位置を制御します。
repeat(auto-fit, minmax(...)) はメディア クエリを使用せずに応答性の高いグリッドをどのように作成しますか?
auto-fit キーワードは、コンテナの現在の幅に基づいて可能な限り多くの列をフィットさせるようにグリッド コンテナに指示します。 minmax(200px, 1fr) 関数は、各列が 200px 未満に縮小しないようにしますが、残りの利用可能なスペースを占有するために比例して拡張します。
最新の CSS レイアウトのギャップ プロパティとは何ですか?
ギャップ プロパティは、フレックスボックス レイアウトとグリッド レイアウトの両方で行と列間の一貫した間隔を定義します。これは、廃止されたマージン ハックとネガティブ マージンを置き換えるものであり、コンテナーの外周にスペースを追加しません。
生成された CSS スタイルは、最新のすべての Web ブラウザー間で互換性がありますか?
はい。最新の CSS ボックス シャドウ、線形/放射状グラデーション、フレックスボックス、CSS グリッドは、-webkit- や -moz- などのレガシー ベンダー プレフィックスを必要とせず、Chrome、Firefox、Safari、Edge、iOS Safari、Android ブラウザー全体でユニバーサルにサポートされています。
flex-grow と flex-shrink はアイテムのサイズをどのように決定しますか?
flex-grow は、コンテナの残りの正のスペースのうち、アイテムがその兄弟と比較してどれだけの量を吸収するかを指定します。 flex-shrink は、コンテナーのスペースが不十分な場合に項目を圧縮する速度を決定します。
エクスポートした CSS を React、Vue、Svelte、または Tailwind プロジェクトで使用できますか?
はい。エクスポートされた CSS ルールは、標準 CSS ファイル、CSS モジュール、スタイル付きコンポーネントに直接貼り付けることも、任意の Tailwind ユーティリティ クラス (shadow-[...]、bg-[linear-gradient(...)] など) に変換することもできます。
結果が見つかりません
検索キーワードを変更してもう一度お試しください。