<img src="./windpress.svg" alt="WindPress Logo" width="100"> <h1 align="center">WindPress</h1> WindPress is a platform-agnostic plugin for integrating Tailwind CSS into WordPress, allowing you to harness the full power of Tailwind CSS within the WordPress ecosystem. <a href="https://downloads.wordpress.org/plugin/windpress.zip"> <picture> <img src="https://img.shields.io/wordpress/plugin/v/windpress.svg?logo=wordpress&label=version" alt="WordPress plugin version" /> </picture> </a> <a href="https://wordpress.org/plugins/windpress/advanced/"> <picture> <img src="https://img.shields.io/wordpress/plugin/dt/windpress.svg?logo=wordpress" alt="WordPress plugin downloads" /> </picture> </a> <a href="https://wordpress.org/plugins/windpress/"> <picture> <img src="https://img.shields.io/wordpress/plugin/installs/windpress.svg?logo=wordpress" alt="WordPress plugin active installs" /> </picture> </a> <a href="https://wordpress.org/support/plugin/windpress/reviews/?filter=5/#new-post"> <picture> <img src="https://img.shields.io/wordpress/plugin/stars/windpress.svg?logo=wordpress" alt="WordPress plugin rating" /> </picture> </a> <a href="https://github.com/wind-press/windpress/releases"> <picture> <img src="https://img.shields.io/github/v/release/wind-press/windpress.svg?logo=github" alt="GitHub Release" /> </picture> </a> <a href="https://github.com/wind-press/windpress/blob/master/LICENSE"> <picture> <img src="https://img.shields.io/github/license/wind-press/windpress.svg" alt="MIT License" /> </picture> </a> <a href="https://github.com/wind-press/windpress/actions"> <picture> <img src="https://img.shields.io/github/actions/workflow/status/wind-press/windpress/deploy.yaml" alt="Build Status" /> </picture> </a> <a aria-label="GitHub Sponsors" href="https://github.com/sponsors/suasgn"> <picture> <img alt="GitHub Sponsors button" src="https://img.shields.io/github/sponsors/suasgn?logo=github"> </picture> </a> <a aria-label="Support me on Ko-fi" href="https://ko-fi.com/Q5Q75XSF7"> <picture> <img alt="ko-fi button" src="https://img.shields.io/badge/Buy_me_a_Coffee-ff5e5b?logo=ko-fi&label=Ko-fi"> </picture> </a> <a aria-label="Join Our Facebook community" href="https://wind.press/go/facebook"> <picture> <img alt="facebook group button" src="https://img.shields.io/badge/Join_us-0866ff?logo=facebook&label=Community"> </picture> </a>

[!NOTE]

You are looking at the WordPress plugin for integrating Tailwind CSS v3 and v4.

Intro

Use Tailwind CSS within the block editor, page builders, plugins, and themes — no build step is required.

Features

✅ Easy to use: Simplified and intuitive settings to get you up and running quickly.
🥰 Customizable Configuration: Comes with a default Tailwind CSS configuration, which can be customized to fit your needs.
⚡️ Lightweight and blazingly fast: Built on top of WordPress REST API. It has a small footprint and won't slow down your site.
📦 Compile on the browser. No server is required: Generate the final CSS file in the browser without server-side tools. None of your data is transferred over the network.

Integrations

Seamless integration with the most popular visual/page builders:

Gutenberg / Block Editor
GreenShift
Kadence WP
LiveCanvas
Timber
Blockstudio — Pro
Breakdance — Pro
Bricks — Pro
Builderius — Pro
Etch — Pro
Meta Box Views — Pro
Oxygen 6 / Classic — Pro
WPCodeBox 2 — Pro

Planned / In Progress

🛠 Development

Requirements

Getting Started

Clone the repository to your wp-content/plugins directory:

git clone https://github.com/wind-press/windpress.git windpress-dev
cd windpress-dev

Install the PHP dependencies:
```
composer install
```
Install the JavaScript dependencies:
```
pnpm install
```
Start the development server:
```
pnpm run dev
```
Activate the plugin.

Community

💬 Join the community on Facebook Group and Discord

Repo Activity

Windpress

Install / Use

README