# How to remove Tailwind from a Phoenix project

There's a chance you have an existing Phoenix project that has been created with the default option of having TailwindCSS integrated, but you would like to go vanilla CSS.

## Steps

1. Remove `:tailwind` from `mix.exs`
2. Remove related commands from `aliases` in  `mix.exs` (make sure to preserve any `esbuild` builds if you are using that).
3. Remove `@import "tailwindcss/...` from `app.css`
4. Open `js/app.js` and add `import "../css/app.css"` to it.
5. Delete file `/assets/tailwind.config.js`
6. Remove block starting with   `config :tailwind` from `config.exs`
7. Remove `tailwind: {Tailwind, :install_and_run, [:default, ~w(--watch)]}` from `watchers` inside `dev.exs`
8. Run `mix deps.clean --unlock --unused`

{% hint style="info" %}
You may have to fix layout related issues, how you render flash messages, and adjust `core_components.exs.`

`Original solution found in` [`Elixir Forums`](https://elixirforum.com/t/how-to-remove-tailwind-from-phoenix-completely-i-only-want-vanilla-css/54551)`.`
{% endhint %}