How do I install the Material UI Tailwind skill?

Run npx skillmds@latest add tomevault-io/material-ui-tailwind in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Material UI Tailwind safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Material UI Tailwind?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Material UI Tailwind free to use?

Yes. Installing skills from SkillMD is free. This skill is licensed under MIT.

Who published Material UI Tailwind?

tomevault-io (@tomevault-io) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Material UI Tailwind

Name: Material UI Tailwind
Author: tomevault-io

Integrates Material UI with Tailwind CSS v4 using cascade layers (enableCssLayer, @layer order) and documents Tailwind v3 interoperability (preflight, important, injectFirst, portals). Use when combining MUI with Tailwind utilities, slotProps className, or theme token bridges.

tomevault-io Updated Sep 17, 2026

Web & Frontend

Install

Press C to copy

$ npx skillmds@latest add tomevault-io/material-ui-tailwind

Installs into ~/.claude/skills (or .claude/skills inside a project). Restart Claude Code to pick it up.

Download .zip

＋ Add to plugin

README badge

[![SkillMD](https://skillmd.com/badge/tomevault-io/material-ui-tailwind.svg)](https://skillmd.com/skills/tomevault-io/material-ui-tailwind)

Trust & safety

2 of 3 audits passed

Last audited Sep 19, 2026 · commit 3d9c35e

License: MIT
Works with: Claude Code Claude.ai OpenAI Codex +

File contents

Material UI and Tailwind CSS

Agent skill for MUI + Tailwind. SKILL.md is the entry; AGENTS.md is the full guide.

When to apply

Tailwind utilities not overriding MUI (specificity / layer order)
Setting up v4 with Next.js App or Pages Router, or Vite
className / slotProps.*.className on MUI components
Mapping --mui-* variables into Tailwind @theme
Legacy v3 setups or migrations

Sections in AGENTS.md

Area	Topics
v4	`@layer` order, `mui` before `utilities`
Next.js	`enableCssLayer`, Pages `GlobalStyles` + shared cache
SPA	`StyledEngineProvider` + `enableCssLayer`
Usage	Root vs slot `className`
`@theme`	Full snippet on docs site; needs `cssVariables`
IntelliSense	VS Code `classRegex`
v3	preflight, `important`, `injectFirst`, portals

Full guide

Read AGENTS.md. Copy-paste snippets: reference.md.

Source: mui/material-ui — distributed by TomeVault.

tomevault-io/skills-registry/tree/main/mui--material-ui--material-ui commit 3d9c35ee9b

Frequently asked questions

npx skillmds@latest add tomevault-io/material-ui-tailwind