JSFiddle - React, Tailwind, and code Playground

by Nicholas Berlette

HTML

<!DOCTYPE html>
<html>

<head>
  <title>image.ts documentation</title>
  <style>
    html,
    body {
      --font-mono: "IBM Plex Mono", "Dank Mono", "Operator Mono", "Fira Code", 'Courier New', Courier, ui-monospace, monospace;
      --font-sans: "IBM Plex Sans", "Lucida Grande", Arial, Helvetica, ui-sans-serif, sans-serif;
      --font-serif: "IBM Plex Serif", Georgia, Times, "Times New Roman", ui-serif, serif;
      /* background-color: #101010; */
      color-scheme: dark;
      font-family: var(--font-mono);
    }

    div {
      margin: 0.5rem;
    }

    .color-555 {
      color: #a8d3c2cc;
      display: table-row;
    }

    .color-a0a,
    .color-red {
      color: indianred;
      font-family: var(--font-mono) !important;
    }

    .color-a0a h3 {
      display: inline-block;
      font-family: var(--font-mono);
    }

    .color-a0a-2 {
      color: rgba(254, 139, 38, 0.7);
      font-weight: bold;
      font-family: var(--font-mono) !important;
    }

    .color-5ff {
      color: #5ff;
      font-weight: bold;
      font-family: var(--font-mono);
      ;
    }

    .color-purple {
      color: rgb(123, 123, 247);
    }

    section {
      margin: 1rem 0;
    }

    :root {
      --color-keyword: #ffa3d3;
      --color-variable: #88fefe;
      --color-constant: #ff6287;
      --color-identifier: #ffb15f;
      --color-class: #e082ff;
      --color-boolean: #b6ef9c;
      --color-number: #ffde79;
      --color-string: #c1ffa4;
      --color-regex: #99ccff;
      --color-comment: #a2a2a2;
      --color-deprecated: #aaaaaaaa;
      --color-jsdoc: #decfba;
      --color-function: #d572f7;
      --color-punctuation: #a8d3c2cc;
      --color-type: #5ff;
    }

    .argument {
      color: var(--color-class);
    }

    .keyword {
      color: var(--color-keyword);
    }

    .boolean {
      color: var(--color-boolean);
    }

    .number {
      color: var(--color-number);
    }

    .regex {
      color: var(--color-regex);
    }

    .comment {
    ...

CSS

html, body {
  background-color: #110c1c;
  margin:0;
  padding:0;
}

body {
  max-width: 80vw;
  margin: 2.5rem auto;
}

span, p {
  line-height: 1.8rem;
}