JSFiddle - React, Tailwind, and code Playground

by sorvell1

HTML

<script src="https://unpkg.com/@webcomponents/webcomponentsjs@latest/webcomponents-loader.js"></script>

<!-- Works only on browsers that support Javascript modules like Chrome, Safari, Firefox 60, Edge 17 -->
<script type="module">
  import {LitElement, html, css} from 'https://unpkg.com/lit-element/lit-element.js?module';

  class MyElement extends LitElement {
  
	  static get properties() {
    	return {
      	mood: {type: String}
      }
    }
    
    static get styles() {
      return css`.mood { color: green; }`;
    }

    render() {
      return html`Web Components are <span class="mood">${this.mood}</span>!`;
    }  
  }
	
  customElements.define('my-element', MyElement);
</script>

<my-element mood="great"></my-element>