ライブページを
Tailwind CSS へ変換

Tailfind を使用する理由

インターフェース開発フローを改善する

選択中の要素のそばに操作を保つ便利なポップオーバー

インラインポップオーバーにより主要な操作が近くに保たれるため、選択を絞り込み、適切なフラグメントをより速くエクスポートできます。同じ操作はキーボードショートカットでも使えるため、選択フローを離れずに作業を続けられます。

正確なフラグメントを選択

キャプチャが実際に再利用したい境界と一致するまで Web ページ内を移動します。

プレーンな Tailwind 出力をエクスポート

Tailfind は選択したフラグメントを読みやすい Tailwind CSS に変換し、一から作り直す代わりに調整できるようにします。

拡張機能のポップオーバーからキャプチャを開始します

検査する要素を選択し、ページ本文全体をコピーし、ワークフローに一致するように拡張機能を構成します。

あらゆるコードベースをサポート

特定のフレームワークやスタイル設定を必要とせず、レガシーなフロントエンド、最新のコンポーネントアプリ、複数技術が混在する本番環境で動作します。

あらゆるスタイルを組み合わせる

作成されたクラスとインライン宣言を別々に扱うのではなく、まとめて読み取ります。

Tailwind から Tailwind へ

元のページがすでに Tailwind を使っている場合も、出力は Tailwind らしい形のまま調整しやすくなります。

SVG をサポート

インラインベクターグラフィックはそのまま残るため、アイコン、ロゴ、イラストはエクスポート後も維持されます。

余分なノイズを除去

繰り返しのラッパー、重複した宣言、低価値のスタイルの乱雑さを回避することで、生成されたマークアップに焦点を当てたままにします。

難読化されたマークアップを理解する

クラス名が圧縮されている、生成されている、または信頼できる情報源として役に立たない運用ページで動作します。