<my-component></my-component>
my-component::part(foo) {
  background: lightgray;
}
class MyComponent extends HTMLElement {
  constructor() {
    super()
    this.attachShadow({ mode: 'open' }).innerHTML = `
      <span part="foo">
        My background will be lightgray!
      </span>
    `
  }
}

customElements.define('my-component', MyComponent)
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.