1. Click on the Getting Started Button where in you will be draw to the dcoumentation page. Then click the link beside Detection Page

  1. When you will go for the first time you will see the following web page -

You will need to raise a product request access by linking the drive link below.

  1. You will receive an email confirmation when your access to the drive is provided.
    You can now download the plugin and the exe based on your operating system.


Now you need to unzip the plugin and go to the manage extension’s page.

Now you have to enable the developer mode to enable the plugin

Click the Load Unpacked to load the extension.

Now you will get an id in the extension. Node it down.

Now go back to the download page and download the exe based on the operating system.

And Create a config.json file

If you are mac on linux then run the exe as follows-

$ ./css-to-tailwind-api-macos <Fill in the extension id in here>

Now restart the application as

$ ./css-to-tailwind-api-macos

Finally you are good to go now you just reload and sign in to your google account -


On Successful Login you will see the following dashboard -


Now go to any web site where in you want to extract the css of a particular component -

Click on the Extension and you will see the following pop up -

Now Click on the Try now Button on the Extension and hover on the element of which you want to get the tailwind css and the missing CSS classes and press v


If You want to get the css only then press c to get the css of the given element

If you want to get the tailwind classes of the element only press t

Finally you can press M to get the missing tailwind classes for a given element


These classes get copied to your clipboard as well which can then be used to create your own component using the tailwind utility classes.