Getting Started
CDN (no build step)
<script src="https://unpkg.com/@materialelements/core/dist/materialelements.min.js"></script>
<me-theme-provider>
<me-css-baseline></me-css-baseline>
<me-button variant="contained">Hello World</me-button>
</me-theme-provider>
npm
npm install @materialelements/core
import '@materialelements/core';
// or cherry-pick:
import '@materialelements/core/button';
Using a MUI Theme
Pass any object conforming to MCTheme (or the output of MUI's createTheme()) to the .theme property:
import { createTheme } from '@mui/material/styles';
const theme = createTheme({
palette: { primary: { main: '#e91e63' } }
});
document.querySelector('me-theme-provider').theme = theme;
Without MUI
document.querySelector('me-theme-provider').theme = {
palette: {
mode: 'light',
primary: { main: '#1976d2', light: '#42a5f5', dark: '#1565c0', contrastText: '#fff' },
},
};
