Web Components & Custom Elements
normal version
<ufo-element>πΈ</ufo-element>
<ghost-element>π»</ghost-element>
<shit-element>π©</shit-element>
emoji version
<ufo-element-πΈ>πΈ</ufo-element-πΈ>
<ghost-element-π»>π»</ghost-element-π»>
<shit-element-π©>π©</shit-element-π©>
<!-- CDN -->
<script async type="module" src="https://unpkg.com/emoji-elements/src/index.js"></script>
<!-- npm -->
<script async type="module" src="https://github.com/xgqfrms/emoji-element/raw/master/node_modules/emoji-elements/src/index.js"></script>
<!-- ES Module -->
<script type="module">
import '/node_modules/emoji-elements/src/index.js';
// ...
</script>
<emoji-element text="π»πΈπ©" alt="Emoji Element">
<span slot="placeholder">π»πΈπ©</span>
</emoji-element>
<other-element></other-element>
<my-element></my-element>
<script src="https://github.com/xgqfrms/emoji-element/raw/master/./webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="https://github.com/xgqfrms/emoji-element/blob/master/paper-progress.html">
<style is="custom-style">
paper-progress {
display: block;
width: 100%;
margin: 20px 0;
}
</style>
<paper-progress indeterminate></paper-progress>
https://www.npmjs.com/package/emoji-element