demo/index.html

<!DOCTYPE html>
<html lang="en-US" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Rust Wasm Blurhash</title>

    <style>
      :root {
        --blue: #1261C9;
        --indigo: #1e12c9;
        --indigo-darker: #1a10b4;
      }
      *:focus {
        outline: 3px solid transparent;
        box-shadow: 0 0 0 3px var(--indigo);
      }
      body {
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
      }
      h1, h2 {
        line-height: 1.25;
      }
      h2 {
        margin-top: 0;
        margin-bottom: 0;
      }
      p, li, h1, h2 {
        max-width: 36em;
      }
      pre {
        padding: 1rem;
        overflow-x: auto;
        -webkit-overflow-scroll: touch;
        border-radius: 4px;
        background-color: #eaeaef;
        font-size: 1rem;
      }
      a:link, a:visited {
        transition: color 0.12s ease;
        color: var(--indigo);
      }
      a:hover, a:focus, a:active {
        color: var(--indigo-darker);
      }
      a:focus {
        text-decoration: none;
      }
      canvas {
        display: block;
      }
      img {
        display: block;
        max-width: 100%;
      }
      .z-n1 {
        z-index: -1;
      }
      .transition-opacity {
        transition: opacity 1s ease-in-out;
      }
      .vs2 > * + * {
        margin-top: 0.5rem;
      }
      .vs3 > * + * {
        margin-top: 1rem;
      }
      .vs4 > * + * {
        margin-top: 2rem;
      }
    </style>
  </head>
  <body class="f4 lh-copy sans-serif bg-near-white near-black">
    <div id="root"></div>
    <script src="./bootstrap.js"></script>
  </body>
</html>