
Security News
Software Engineering Daily Podcast: Feross on AI, Open Source, and Supply Chain Risk
Socket CEO Feross Aboukhadijeh joins Software Engineering Daily to discuss modern software supply chain attacks and rising AI-driven security risks.
material-custom-elements
Advanced tools
This is a package that bundles all of the web components from the Material Web repo so that you don't need a module bundler to use them.
Components:
button,checkbox,circular-progress,circular-progress-four-colors,dialog,drawer,fab,formfield,icon-button-toggle,icon-button,icon,linear-progress,list,menu,radio,select,slider,snackbar,switch,tab-bar,tab,textarea,textfield,top-app-bar-fixed,top-app-bar,Variants:
component.js The unminified, bundled component in an IIFE format.component.min.js RECOMMENDED The minified, bundled component in an IIFE format.component.esm.js The unminified component as an ESM module. All imports are reexported.component.esm.min.js The minified component as an ESM module. All imports are reexported.All components have .map files.
There is also a file that includes all components. This is preferred over manually importing every component since helper libraries (like lit) aren't imported multiple times.
To use:
(index.html)
<html>
<head></head>
<body>
<script
async
src="https://unpkg.com/material-custom-elements/(component).min.js"
></script>
</body>
</html>
As a module:
(index.html)
<html>
<head></head>
<body>
<script
type="module"
src="https://unpkg.com/material-custom-elements/(component).esm.min.js"
></script>
</body>
</html>
Importing all components:
(index.html)
<html>
<head></head>
<body>
<script
async
src="https://unpkg.com/material-custom-elements/all.min.js"
></script>
</body>
</html>
As a module:
(index.html)
<html>
<head></head>
<body>
<script
type="module"
src="https://unpkg.com/material-custom-elements/all.esm.min.js"
></script>
</body>
</html>
FAQs
Material web components bundled for the web.
We found that material-custom-elements demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Security News
Socket CEO Feross Aboukhadijeh joins Software Engineering Daily to discuss modern software supply chain attacks and rising AI-driven security risks.

Security News
GitHub has revoked npm classic tokens for publishing; maintainers must migrate, but OpenJS warns OIDC trusted publishing still has risky gaps for critical projects.

Security News
Rust’s crates.io team is advancing an RFC to add a Security tab that surfaces RustSec vulnerability and unsoundness advisories directly on crate pages.