Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
<!-- add dependencies -->
<link rel="import" href="./dependent-element.html">
<!-- web component template -->
<template id="nameTagTemplate">
.outer {
border: 2px solid brown;
background: red;
.name {
color: black;
<div class="outer">
<div class="name">
<!-- web component class -->
class NameTag extends HTMLElement {
const shadowRoot = this.attachShadow({mode: 'open'});
const template = document.querySelector('#nameTagTemplate');
const clone = document.importNode(template.content, true);
customElements.define('name-tag', NameTag);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment