MUI v7 Patterns

Purpose

Material-UI v7 (released March 2025) patterns for component usage, styling with sx prop, theme integration, and responsive design.

Note: MUI v7 breaking changes from v6:

• Deep imports no longer work - use package exports field
• onBackdropClick removed from Modal - use onClose instead
• All components now use standardized slots and slotProps pattern
• CSS layers support via enableCssLayer config (works with Tailwind v4)

When to Use This Skill

• Styling components with MUI sx prop
• Using MUI components (Box, Grid, Paper, Typography, etc.)
• Theme customization and usage
• Responsive design with MUI breakpoints
• MUI-specific utilities and hooks