JSFiddle - React, Tailwind, and code Playground

by Josh Pullen

HTML

<svg id="rocket-logo" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="64" height="64" viewBox="0 0 64.000001 64.000001" version="1.1" inkscape:version="0.91 r" sodipodi:docname="spelling-logo-2.svg">
  <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1920" inkscape:window-height="1023" id="namedview4147" showgrid="false" inkscape:zoom="1.6436999" inkscape:cx="-28.222368" inkscape:cy="38.431716" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="g4235"/>
  <defs id="defs4724"/>
  <metadata id="metadata4727">
    <rdf:RDF>
      <cc:Work rdf:about="">
        <dc:format>image/svg+xml</dc:format>
        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
        <dc:title/>
      </cc:Work>
    </rdf:RDF>
  </metadata>
  <g id="layer1" transform="translate(0,-988.36216)">
    <g transform="matrix(0.0988424,0.09886746,-0.0988424,0.09886746,51.361216,921.89549)" style="display:inline" id="g4235">
      <path id="path4157" d="m 272.43238,791.04804 c 91.22603,-223.75431 166.30347,-223.76425 257.14286,0 0,0 87.55637,-224.38983 -129.26142,-223.88734 -216.81779,0.50249 -127.88144,223.88734 -127.88144,223.88734 z" style="fill:#e74c3c;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"/>
      <path id="path4136" d="M 475.03591,679.52094 C 600.51323,461.27903 400.0553,277.27086 400.0553,277.27086 c 0,0 -199.4501,182.03291 -72.08724,401.7208 z"...

CSS

html, body {
  width: 100%;
  height: 100%;
}

body {
  background: #2c3e50;
  
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  
  font-family: sans-serif;
  text-align: center;
}

h1 {
  color: white;
  font-size: 24px;
  margin: 0;
}

p {
  color: rgba(255,255,255,0.8);
  font-size: 16px;
}