Calmcode - tailwind: extensions

Extensions

1 2 3 4 5 6 7

If you are using VSCode you can also install the Tailwind CSS IntelliSense extension to get autocompletion. To use this extension you need to have a tailwind.config.js file in your main directory. The file can remain empty, but the presense of this file is necessary for the extension to work.

Finally, if you are using VSCode then you'll also want to install the Live Server extension. This will allow you to see your html files in a browser directly from VSCode.

With these extensions installed you should be able to make changes and see the effect very quickly.

<!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
  <h1 class="text-2xl text-green-500 bg-slate-300 font-bold underline">
    Hello world!
  </h1>
</body>
</html>