mui/material-ui

material-ui-theming

Guides Material UI theming and design tokens (createTheme, ThemeProvider, palette, colorSchemes, cssVariables, theme.vars, dark mode, TypeScript augmentation).

查看源码
仓库原始内容

按源仓库内容呈现,保留标题、案例、代码、表格、链接以及原文引用的演示图片。

Material UI theming and design tokens

Agent skill for theme creation, design tokens, light/dark, and CSS theme variables. SKILL.md is the entry; AGENTS.md is the full guide.

When to apply

  • createTheme, ThemeProvider, useTheme, CssBaseline
  • colorSchemes, useColorScheme, storage / SSR behavior
  • cssVariables: true, theme.vars, applyStyles('dark', …)
  • Custom theme keys and TypeScript module augmentation

Sections in AGENTS.md

AreaTopics
Core setupImports, provider placement, useTheme
Token mappalette, typography, spacing, shape, breakpoints, components, …
Palettemain / derived colors, @mui/material/colors, mode
Color schemesvs palette-only, hydration, ThemeProvider props
CSS variablescssVariables, reserved vars, flicker avoidance
CompositionMulti-step createTheme, deepmerge, nesting providers
Custom tokensAugmenting Theme / ThemeOptions

Full guide

Read AGENTS.md for the complete instructions and links.

TypeScript snippets: reference.md.