tailwindcss
SHA-256ユーティリティファーストのCSSフレームワークで、カスタムCSSを書くことなく、カスタマイズされたUIをすばやく構築できます。Bootstrapと比較して、より軽量で、より柔軟です。
スマートダウンロード
Download 版をダウンロード
v4.3.3 · 107.3 MB
原子クラスを使って素早くCSSを書き、煩雑なスタイルファイルに別れを告げましょう。
主な機能
- 原子化ユーティリティクラス:flex、grid、paddingなど、すぐに使える何百ものクラス名を直接使用してUIを構築
- オンデマンドコンパイル(JIT):実際に使用するスタイルのみを生成し、CSSファイルのサイズを大幅に削減
- レスポンシブデザイン:スマートフォン、タブレット、デスクトップなどのブレークポイントを内蔵し、メディアクエリを記述する必要なし
できないこと
- •注意:Tailwind CSS v4 と v3 では設定方法が異なります。アップグレード前に必ず公式移行ガイドをお読みください。また、これはスタイルフレームワークであり、既製のコンポーネントは提供されないため、自分でクラス名を組み合わせてレンダリング効果を実現する必要があります。
使用例
- マーケティングページや管理画面を迅速に構築し、CSSを手書きする時間を省く
- フロントエンドコンポーネントライブラリ開発におけるデザインシステムのカスタマイズで、効率と一貫性を両立する
詳細説明
Tailwind CSS は、ユーティリティファーストの CSS フレームワークであり、HTML 内で直接ユーティリティクラスを使用して、モダンなレスポンシブインターフェースを構築できます。その JIT エンジンはオンデマンドでコンパイルし、使用する CSS のみを生成するため、最終的なバンドルサイズが小さくなり、読み込みが速くなります。Bootstrap のようなコンポーネントベースのフレームワークと比較して、Tailwind はコンポーネントのスタイルを事前設定せず、より大きなデザインの柔軟性を提供し、デフォルトのスタイルを上書きする必要もありません。テーマのカスタマイズ、ダークモード、レスポンシブバリアントのサポートを内蔵しており、モダンな JavaScript ビルドプロセスとシームレスに統合できます。
タグ
はじめ方
ソフトウェアをインストール
ダウンロードしたインストーラをダブルクリックし、指示に従ってください
npm で Tailwind をインストールして初期化する:npm install tailwindcss @tailwindcss/cli && npx @tailwindcss/cli init
CSS エントリーファイルで @import 'tailwindcss' を設定し、ビルドスクリプトに Tailwind CLI を追加する。
HTML テンプレートで utility クラスを直接使用し、ビルドコマンドを実行すると、最終的な CSS が生成される。
- npm で Tailwind をインストールして初期化する:npm install tailwindcss @tailwindcss/cli && npx @tailwindcss/cli init
- CSS エントリーファイルで @import 'tailwindcss' を設定し、ビルドスクリプトに Tailwind CLI を追加する。
- HTML テンプレートで utility クラスを直接使用し、ビルドコマンドを実行すると、最終的な CSS が生成される。
SHA-256 チェックサム確認済み
GitHub 公式 Release ページから抽出されたチェックサム
SHA256 チェックサム
e0e260ce048014e9268f6237ff18f8ccf02cef521cbd0ae04e82c2cdf7aa3955このチェックサムは GitHub Release ページから抽出されたものです。ダウンロード後にファイルの整合性を確認してください。
本プラットフォーム上のすべての SHA-256 チェックサムは、プロジェクトの公式 GitHub Release ページから抽出されたもので、一切の改変はありません。GitHub Releases ページで独自に検証できます。
オープンソースの透明性
GitHub ソースを見るアンインストール情報
アンインストールする場合は、プロジェクトで npm uninstall tailwindcss と npm uninstall @tailwindcss/cli を実行し、関連する設定ファイルとエントリファイル内の Tailwind のインポートを削除するだけです。
追加の依存関係なし
ダウンロード後すぐに使用可能。追加のランタイムは不要です。