> For the complete documentation index, see [llms.txt](https://docs.vueless.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vueless.com/global-customization/custom-tailwind-classes.md).

# Custom tailwind classes

To prevent class duplication, Vueless uses [tailwind-merge](https://github.com/dcastil/tailwind-merge) under the hood.

If you plan to use custom Tailwind CSS classes to style Vueless components, add them to the Vueless config under the `tailwindMerge` key, following the `tailwind-merge` configuration.

See the full list of available properties [here](https://github.com/dcastil/tailwind-merge/blob/main/src/lib/default-config.ts).

{% code title="vueless.config.js" %}

```js
export default {
  tailwindMerge: {
    extend: {
      theme: {
        classGroups: {
          "ring-w": [{ ring: ["tiny"] }],
          "font-size": [{ text: ["2xs"] }],
        }
      }
    }
  }
};
```

{% endcode %}
