Vite-plugin-windicss NPM

Features

⚡️ It's FAST - 20~100x times faster than Tailwind on Vite
🧩 On-demand CSS utilities (Fully compatible with Tailwind CSS v2)
📦 On-demand native elements style reseting (preflight)
🔥 Hot module replacement (HMR)
🍃 Load configurations from tailwind.config.js
🤝 Framework-agnostic - Vue, React, Svelte and vanilla!
📄 CSS @apply / @screen directives transforms (also works for Vue SFC's <style>)
🎳 Support Variant Groups - e.g. bg-gray-200 hover:(bg-gray-100 text-red-300)
😎 "Design in Devtools" - if you work this way in the traditional Tailwind, no reason we can't!

Documentation

Read the documentation for more details.

New Features in v3.0

Attributify Mode

Enabled it by

// windi.config.ts
export default {
  attributify: true,
}

And use them as you would like:

<button 
  bg="blue-400 hover:blue-500 dark:blue-500 dark:hover:blue-600"
  text="sm white"
  font="mono light"
  p="y-2 x-4"
  border="2 rounded blue-200"
>
  Button
</button>

Prefix

If you are concerned about naming confliction, you can add custom prefix to attributify mode by:

// windi.config.ts
export default {
  attributify: {
    prefix: 'w:',
  },
}

<button 
  w:bg="blue-400 hover:blue-500 dark:blue-500 dark:hover:blue-600"
  w:text="sm white"
  w:font="mono light"
  w:p="y-2 x-4"
  w:border="2 rounded blue-200"
>
  Button
</button>

Alias Config

// windi.config.ts
export default {
  alias: {
    'hstack': 'flex items-center',
    'vstack': 'flex flex-col',
    'icon': 'w-6 h-6 fill-current',
    'app': 'text-red',
    'app-border': 'border-gray-200 dark:border-dark-300',
  },
}

License

vite vite-plugin windicss tailwindcss

debug kolorist windicss @windicss/plugin-utils

@glennliao/uni-x @infinitebrahmanuniverse/nolb-vite-plugin-w @dankeu/vite-plugin-vue @everything-registry/sub-chunk-3062 vite-slides vite-serve vite-garden ux-cesium vue-directus @vuepress-plume/plugin-windicss @vuepress-plume/vuepress-plugin-windicss @wu-component/wu-cli @zctya/comptest am-editor-vue astro-integration-windicss astro-windi astro-windicss aslide aplitable simple-frame-library ui-goku theme-kry toosi-chatbot unmono @kunlunjs/cli nuxt-windicss nuxt-windicss-module rlawodus-react-ui-vite @inease/slidev-cli @inease/slidev-client @firestead/console @franklinjs/react @fesjs/plugin-windicss @packetsafari/cli @packetsafari/client fisand-doc @carverry/app class-curd coya-editor-new corgi-biu @kengic/vue @kolibrijs/cli @kolibrijs/client @kolibry/cli @kolibry/client @cpany/cli @docus/nuxt-windicss @somebuild/build-preview @somebuild/build-docs @dt-frames/plugins @mno/atreides @spark-build/vite-plugin-react-auto-config @mooljs/plugin-windicss

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

vite-plugin-windicss v1.9.3

Features

Documentation

New Features in v3.0

Attributify Mode

Prefix

Alias Config

Sponsors

License