Encounters

Better reading, better writing, better…

A simple colour palette for writing day or night. Maybe it’s a program to take over the world. Maybe it’s a website for a friend. Maybe it’s the Great American Novel. Or maybe it’s just straight up fart jokes. It’s all you, kid!

Download Encounters or View it on GitHub

Preview

<!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Encounters</title>
    <meta name="description" content="A simple colour palette for writing day or night.">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="styles/screen.min.css">
    <!-- Typekit -->
    <script src="//use.typekit.net/whk3yjv.js"></script>
    <script>try{Typekit.load();}catch(e){}</script>
  </head>

  <body class="light-theme">
    <div class="background-container">
    ...

/* Custom Properties */

:root {
  --display-font: "museo-sans", sans-serif;
  --monospace-font: "source-code-pro", monospace;
  --base-01: #181818;
  --base-02: #202020;
  ...
}

/* Layout */

.content-container {
  font: 16px/1.5 var(--monospace-font);
  text-align: center;
  transform: translate3d(0,0,0);
}

document.addEventListener("DOMContentLoaded", function () {
  // Toggle between the dark and light themes
  document.querySelectorAll(".toggle").forEach(function (el) {
    el.addEventListener("click", function (e) {
      e.preventDefault();
      document.body.classList.toggle("light-theme");
      document.body.classList.toggle("dark-theme");

      var swap = document.querySelector(".swap");
      swap.textContent =
        swap.textContent === "light-theme" ? "dark-theme" : "light-theme";
    });
  });

  // Change the theme based on the time of day
  var hour = new Date().getHours();
  ...

# Encounters

A simple colour palette for writing day or night. Maybe it’s a program to take over the world. Maybe it’s a website for a friend. Maybe it’s the Great American Novel. Or maybe it’s just straight up fart jokes. It’s all you, kid!

## Editors

* [Sublime Text](https://www.sublimetext.com)
* [TextMate](https://macromates.com)
* [VS Code](https://code.visualstudio.com)
* [Zed](https://zed.dev)

## License

...

Support

Editors

Terminals

If there’s a particular app you’d like to see included, let us know or contribute.

Palette

A reversible colour palette means that whatever time of day it is, you can work in a familiar environment that’s easy on your eyes and colourful enough to keep things organised.