Angular + scss(optional) + Tailwindcss

<projectRoot>styles.scss

/**
 * This injects Tailwind's base styles, which is a combination of
 * Normalize.css and some additional base styles.
 *
 * You can see the styles here:
 * https://github.com/tailwindcss/tailwindcss/blob/master/css/preflight.css
 *
 * If using `postcss-import`, use this import instead:
 *
 * @import "tailwindcss/preflight";
 */
 @tailwind preflight;

 /**
  * This injects any component classes registered by plugins.
  *
  * If using `postcss-import`, use this import instead:
  *
  * @import "tailwindcss/components";
  */
 @tailwind components;

 /**
  * Here you would add any of your custom component classes; stuff that you'd
  * want loaded *before* the utilities so that the utilities could still
  * override them.
  *
  * Example:
  *
  * .btn { ... }
  * .form-input { ... }
  *
  * Or if using a preprocessor or `postcss-import`:
  *
  * @import "components/buttons";
  * @import "components/forms";
  */

 /**
  * This injects all of Tailwind's utility classes, generated based on your
  * config file.
  *
  * If using `postcss-import`, use this import instead:
  *
  * @import "tailwindcss/utilities";
  */
 @tailwind utilities;

 /**
  * Here you would add any custom utilities you need that don't come out of the
  * box with Tailwind.
  *
  * Example :
  *
  * .bg-pattern-graph-paper { ... }
  * .skew-45 { ... }
  *
  * Or if using a preprocessor or `postcss-import`:
  *
  * @import "utilities/background-patterns";
  * @import "utilities/skew-transforms";
  */

angular.json

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "<project>": {
      "architect": {
        "build": {
          "builder": "@angular-builders/custom-webpack:browser",
          "options": {
            "customWebpackConfig": {
               "path": "./webpack.config.js"
            }
          }
        }
        "serve": {
          "builder": "@angular-builders/dev-server:generic",
          "options": {
            "browserTarget": "<project>:build"
          },
        }
      }
    }
  }
}

tailwind.js

// See tailwind documentation

webpack.config.js

var tailwindcss = require('tailwindcss');

module.exports = {
  module: {
    rules: [{
      test: /\.scss$|\.sass$/,
      use: [{
        loader: 'postcss-loader',
        options: {
          plugins: [
            tailwindcss('./tailwind.js')
          ]
        }
      }]
    }]
  }
}

Follow instructions on https://tailwindcss.com/docs/installation using npm installation method.

You will also need to install @angular-builders/custom-webpack see https://www.npmjs.com/package/@angular-builders/custom-webpack

NB: post css configuration is added to custom webpack builder NOT postcss.config.js