0 0
Read Time:1 Minute, 4 Second

Tailwind CSS works by scanning all of your HTML files, JavaScript components, and any other templates for class names, generating the corresponding styles and then writing them to a static CSS file.

It’s fast, flexible, and reliable — with zero-runtime.

<script src=”https://cdn.tailwindcss.com”></script>

<!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-3xl font-bold underline">
    Hello world!
  </h1>
</body>
</html>

Using PostCSS

Installing Tailwind CSS as a PostCSS plugin is the most seamless way to integrate it with build tools like webpack, Rollup, Vite, and Parcel.

npm install -D tailwindcss postcss autoprefixer

npx tailwindcss init

Configure your template paths

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

index.html

<!doctype html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

</head>
<body>
  <h1 class="text-3xl font-bold underline">
    Hello world!
  </h1>
</body>
</html>

Get familiar with some of the core concepts that make Tailwind CSS different from writing traditional CSS.

Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleepy
Sleepy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %

About Author

Average Rating

5 Star
0%
4 Star
0%
3 Star
0%
2 Star
0%
1 Star
0%

One thought on “Get started with Tailwind CSS

  1. Picture this – 3 am in the morning, I had a line of fiends stretched around the corner of my block. It was in the freezing middle of January but they had camped out all night, jumping-ready to buy like there was a sale on Jordans. If you were 16 years old, in my shoes, you’d do anything to survive, right? I got good news though; I MADE IT OUT OF THE HOOD, with nothing but a laptop and an internet connection. I’m not special or lucky in any way. If I, as a convicted felon that used to scream “Free Harlem” around my block until my throat was sore, could find a way to generate a stable, consistent, reliable income online, ANYONE can! If you’re interested in legitimate, stress-free side hustles that can bring in $3,500/week, I set up a site you can use: https://incomecommunity.com

Leave a Reply

Your email address will not be published. Required fields are marked *