---
title: "Material UI and Tailwind CSS - Air Market"
description: "Your app uses Material UI components, and you want Tailwind CSS too. Each one brings its own styles, so you have to decide which goes first. This helps you set the two up together so their styles sit…"
canonical: "https://airmarket.ai/app/material-ui-tailwind"
---

[Air Market](/) / [Design](/category/design) / Material UI and Tailwind CSS

Skill by [MUI](/@mui)

# Material UI and Tailwind CSS

Use Material UI and Tailwind together without styles overriding each other

## What this does

Your app uses Material UI components, and you want Tailwind CSS too. Each one brings its own styles, so you have to decide which goes first. This helps you set the two up together so their styles sit in a clear order. Reach for it when you add Tailwind to a Material UI project.

### Top 3 things it does for you

- Combine MUI components with Tailwind utility classes
- Style MUI component parts with Tailwind through className
- Share theme values between MUI and Tailwind

## Information

**Material UI and Tailwind CSS at a glance**

|  |  |
| --- | --- |
| Kind | Skill |
| Publisher | [MUI](/@mui) |
| Category | [Design](/category/design) |
| Works with | Agent Skills - an open standard supported by 40+ agents |
| Version | 1.0.0 |
| Size | 12 KB |
| Licence | MIT |
| Repository | [mui/material-ui](https://github.com/mui/material-ui/tree/3078e63a7d86b761b0d87ff0db462a3a360c4a2f/skills/material-ui-tailwind) |
| GitHub stars | 99,304 (as of Nov 2026) |
| Installs | 379, counted by skills.sh (Nov 2026) |

## Security report

**Verified.** AIR scanned this exact version of Material UI and Tailwind CSS and flagged nothing. AIR's verdict: **safe**.

**What Material UI and Tailwind CSS's check was run against**

|  |  |
| --- | --- |
| Commit | 3078e63a7d86b761b0d87ff0db462a3a360c4a2f |
| Content hash | 5f4fe2e8dee18304fc68480d2569d7e0a3f6ff9942d357be940495fa9f2cd06e |
| Files read | [Browse the files at this exact commit](https://github.com/mui/material-ui/blob/3078e63a7d86b761b0d87ff0db462a3a360c4a2f/skills/material-ui-tailwind/SKILL.md) |

A scan is named by the exact content it read, not by a version number. A different version is a different artifact, and nothing here applies to a version AIR has not scanned.

[Read the full security report for Material UI and Tailwind CSS](/security/material-ui-tailwind)

## About Material UI and Tailwind CSS

Helps you integrate Material UI with Tailwind CSS v4 using cascade layers, including enableCssLayer and the @layer order.

It also documents interoperability with Tailwind v3: preflight, important, injectFirst and portals.

Use it when combining MUI with Tailwind utilities, passing Tailwind classes through slotProps className, or bridging theme tokens between the two.

## What's inside

- SKILL.md - instructions
- AGENTS.md - reference
- metadata.json - data
- README.md - reference
- reference.md - reference

## Questions

### Is Material UI and Tailwind CSS safe to install?

AIR scanned this exact version of Material UI and Tailwind CSS and flagged nothing. AIR's verdict: safe. The verdict is named by the content that was read, at commit 3078e63a7d86, so it cannot drift onto a version nobody scanned. The full report is at https://airmarket.ai/security/material-ui-tailwind.

### How do I install Material UI and Tailwind CSS?

Open https://airmarket.ai/app/material-ui-tailwind on Air Market and use the install action: Air Market hands Claude a prompt naming this exact skill, and Claude sets it up. Source, pinned to the exact commit this listing describes: https://github.com/mui/material-ui/tree/3078e63a7d86b761b0d87ff0db462a3a360c4a2f/skills/material-ui-tailwind. Install from that link, not the branch.

## Related on Air Market

- [More Design listings](/category/design)
- [Everything by MUI](/@mui)

---

Canonical URL: <https://airmarket.ai/app/material-ui-tailwind>