DuoTone Theme

  <html>
  <head>
    <title>DuoTone</title>
    <meta charset=“utf-8”>
    <link rel=“stylesheet” href=“styles.css”>
  </head>
  <body>Hi</body>
</html>

  body {
  padding: 1em;
  color: hsl(0, 0%, 100%);
  background-color: coral;
}
 
/* Viewport based padding */
@media (max-width: 800px) {
  body { padding: 4vh 8vw; }
}

  // Get a desaturated base color
function getBaseColor() {
  let baseColor = chroma.random()
  while (chroma(baseColor).hsl()[1] > 1 / 3) {
    baseColor = chroma(baseColor).desaturate(1 / 8).hex()
  }
  return baseColor
}