https://github.com/siguici/colorwind
🎨 TailwindCSS plugin simplifying light/dark color scheme management with intuitive class names.
https://github.com/siguici/colorwind
color-scheme colorwind dark-mode light-mode plugin tailwind-plugin tailwindcss
Last synced: 28 days ago
JSON representation
🎨 TailwindCSS plugin simplifying light/dark color scheme management with intuitive class names.
- Host: GitHub
- URL: https://github.com/siguici/colorwind
- Owner: siguici
- License: mit
- Created: 2024-04-24T12:58:08.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2025-09-15T18:42:40.000Z (9 months ago)
- Last Synced: 2025-09-15T20:31:35.028Z (9 months ago)
- Topics: color-scheme, colorwind, dark-mode, light-mode, plugin, tailwind-plugin, tailwindcss
- Language: TypeScript
- Homepage: https://colorwind.js.org
- Size: 1.35 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# 🎨 ColorWind
**ColorWind** is a powerful [TailwindCSS](https://tailwindcss.com) plugin
that makes managing light and dark color schemes easy, expressive, and automatic.
This repository contains the full source code,
plugin package, and documentation for the project.
> 📦 The published plugin lives inside [`/packages/colorwind`](./packages/colorwind)
---
## 📚 Documentation
Interactive usage guide, theming examples, and live playground:
👉 **[https://colorwind.js.org](https://colorwind.js.org)**
---
## 📦 Packages
| Package | Description | Registry |
|------------------|-------------------------------------|-------------------------------|
| [`colorwind`](./packages/colorwind) | TailwindCSS plugin for automatic color theming | [NPM](https://npmjs.com/package/colorwind), [JSR](https://jsr.io/@siguici/colorwind) |
---
## 🚀 Getting Started
Install from your preferred package manager:
```bash
npm install colorwind
````
Or use [JSR](https://jsr.io/@siguici/colorwind):
```bash
npx jsr add @siguici/colorwind
```
Then, register the plugin in your Tailwind config:
```ts
import colorwind from 'colorwind';
export default {
plugins: [colorwind],
};
```
---
## 🧠 Why ColorWind?
* Simplifies **light/dark mode theming** with one class.
* Uses **intuitive naming** for color intensity and adaptation.
* Supports **all Tailwind color utilities**, including gradients and opacity.
* Automatically **inverts colors** when needed using the `-reverse` suffix.
Read the full plugin usage guide at [colorwind.js.org/guides](https://colorwind.js.org/guides)
---
## 🛠 Development
To contribute or run locally:
```bash
pnpm install
pnpm dev
```
Then visit [`localhost:4321`](http://localhost:4321)
to preview the documentation locally.
---
## 🤝 Contributing
Found a bug or have a feature request?
* Open an issue on [GitHub Issues](https://github.com/siguici/colorwind/issues)
* Or submit a PR — we welcome contributions!
---
## 📄 License
[MIT](./packages/colorwind/LICENSE.md) © [SIGUI Kessé Emmanuel](https://siguici.deno.dev)
---
## 💫 Credits
Built with ❤️ using [TailwindCSS](https://tailwindcss.com), [Astro](https://astro.build), and [Starlight](https://starlight.astro.build).