Tailwind CSS Course
Tailwind CSS
/
Advanced

Plugins

Definition

JavaScript functions that can be imported into `tailwind.config.js` to inject new utilities, components, or base styles into the framework.

Explain Like I'm New

If Tailwind doesn't have a class you need (like a complex 3D text shadow), you can write a plugin that generates it. You can also download plugins made by other people (like `@tailwindcss/typography`) to instantly give your app superpowers.

Real World Example

Installing the official Typography plugin, which allows you to apply `class="prose"` to a massive block of raw Markdown HTML, instantly styling all the headers, links, and lists beautifully.

Common Use Cases

  • •Extending functionality
  • •Styling Markdown

Interactive Example

Loading...
Console output will appear here...

Interview Questions

basic

  • What official plugin is used to beautifully style raw HTML that you don't control (like from a Markdown file or CMS)?

intermediate

  • Where in the `tailwind.config.js` file do you register a plugin?

Flash Cards

Question

Which plugin?

Click to reveal answer
Answer

`@tailwindcss/typography` (The `prose` class).

Question

Where to register?

Click to reveal answer
Answer

In the `plugins: []` array at the bottom of the config.