Menü
Standardmäßig ist der Prompt ausgewählt, der zuerst die Quelle prüft. Sie können zu einem direkten Befehl wechseln oder eine lokale Kopie herunterladen.
Lesen Sie SKILL.md und alle von SkillsMP angezeigten Begleitdateien, bevor Sie sich für eine Installation entscheiden.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Ein direkter Befehl überspringt den Prüf-Prompt. Prüfen Sie die Quelle, bevor Sie ihn ausführen.
npx skills add https://github.com/dipro-vn/dipro-ai-boost --skill mui-theme-customizationDer Befehl bleibt in einer Zeile. Scrollen Sie horizontal, um ihn vor dem Kopieren vollständig zu prüfen.
Sie bevorzugen eine lokale Kopie? Laden Sie die Dateien herunter, die SkillsMP derzeit vorliegen.
Basierend auf der SOC-Berufsklassifikation
SKILL.md wird angezeigt
| name | mui-theme-customization |
| description | null |
Category: mui · Status: 🟢 Active
Khi cần tùy biến palette, typography, hoặc default style của component MUI ở cấp toàn app.
createTheme, bọc app bằng ThemeProvider.palette (primary, secondary, error...) thay vì rải hex trong code.fontFamily, scale h1..body2) một chỗ.components.MuiX.defaultProps / styleOverrides.sx/theme.palette, không hardcode lại giá trị đã có trong theme.const theme = createTheme({
palette: { primary: { main: '#1976d2' }, text: { secondary: '#5f6b7a' } },
typography: { fontFamily: 'Inter, sans-serif', button: { textTransform: 'none' } },
components: {
MuiButton: { defaultProps: { disableElevation: true },
styleOverrides: { root: { borderRadius: 8 } } },
},
});
<ThemeProvider theme={theme}><App /></ThemeProvider>
Good: màu/typography khai báo trong theme, override default qua components, dùng lại token khắp app.
Avoid: hardcode hex/font trong từng component, lặp sx giống nhau thay vì set default ở theme.
components.MuiX