title: correct way to setup critical css for nextjs project and remove unwanted CSS
body: <p>I have a NextJS project setup -> <a href="https://github.com/stefanre1/nextjs-setup" rel="nofollow noreferrer">https://github.com/stefanre1/nextjs-setup</a></p>
  
  <p>I am wondering what's the right way to remove unwanted css from Tailwindcss and add critical css to each page.</p>
  
  <p>I have tried following some blogs to achieve the same but was not successful.</p>
  
  <p>Obviously I have deleted what I have tried as it was not working. For now kept the bare minimum code in the repository. </p>
  
  <p>Any help or suggestions would be helpful.  </p>
  
  <p>I have tried solution from <a href="https://stackoverflow.com/questions/57057947/how-to-inline-css-in-the-head-tag-of-a-nextjs-project">here</a> to add to head, but it adds all CSS as expected.
  I have tried <a href="https://github.com/FullHuman/postcss-purgecss" rel="nofollow noreferrer">this</a> one as well </p>