Bulma CSS Framework comes with two themes right out of the box: Light and Dark. By default, the themes are selected by what your operating system is set to. If you have your machine always on Light you will only see the Light Theme. If you're always on Dark, you will only see the Dark Theme. If your machine automatically switches at dusk and dawn you'll see both. Bulma makes it very easy to create your own themes, which I did.
I created Pinkie, Hardboiled, Union Red (Dark), and Union Red (Light). I had never created a theme before. Honestly, I've barely used CSS beyond font color and size. But after a day of reading and experimenting, I have these themes running. No, they're not perfect, but they work. I'll update them as time goes on, turning square corners into rounded, making items consistent colors and spacing across different views.
While you can see all the themes in the SCSS file in GitHub, I'm sharing the Pinkie Theme here. It's pretty straightforward.

[data-theme=pinkie],
.theme-pinkie {

  html { background-color: hsla(320 100% 80% / 0.5); color: #000; }
  body { background-color: hsla(320 100% 80% / 0.5); color: #000; }
  
  a:link, a:visited { color: hsl(320 100% 45%); }
  a:hover { color: #fff; }

  --bulma-body-background-color: hsla(320 100% 80% / 0.5);

  .box {
    --bulma-box-background-color: hsla(320 100% 80% / 0.5);
    --bulma-box-color: #000;
  }

  .content {
    --bulma-box-background-color: hsla(320 100% 80% / 0.5);
    --bulma-content-heading-color: hsl(0 0% 0%);
  }

  .navbar {
    --bulma-navbar-h: 360;
    --bulma-navbar-s: 100%;
    --bulma-navbar-item-color-l: 100%;
    --bulma-navbar-item-selected-l: 5%;
    --bulma-navbar-item-selected-background-l: 63%;
    --bulma-navbar-background-color: hsl(320 100% 45%);
  }

  .navbar-brand .navbar-item { color: #fff; }

  trix-editor {
    background-color: #fff;
  }
  .trix-content pre { background-color: hsl(320 100% 80%); color: hsl(0 0% 0%); }
  .footer {
    --bulma-footer-background-color: hsla(320 100% 80% / 0.0);
    // --bulma-footer-color: hsla(320 100% 80% / 0.5);
  }
  .slogan { color: #000; font-weight: 900; margin-right: 75px; }
}