Install TailwindCSS in Angular

Install TailwindCSS in Angular

Today we will see how to install TailwindCSS in an Angular project

KSE's photo
·Jan 28, 2022·

1 min read

Create or use your Angular project

ng new project
cd project

Install and configure TailwindCSS

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init # Will generate a file tailwind.config.js

Configure the paths of all your template files

Edit your tailwind.config.js to add these lines :

module.exports = {
  content: [
  theme: {
    extend: {},
  plugins: [],

Add TailwindCSS directives to your CSS file style.css

@tailwind base;
@tailwind components;
@tailwind utilities;

Enjoy using TailwindCSS

ng serve
Share this