Lemmy configurable dark theme

lemmy-darker.css

:root {
  --navbar-position: sticky; /* `sticky` or `relative` */
  --max-website-width: 1300px;
  --app-background: #111;
  --light: #222;
  --button-color: #333;
  --button-focus: #444;
  --gray: #888;
  --text-primary: #578abf;
  --text-primary-focus: #4077b1;
  --link: #00bc8c;
  --link-focus: #00bc8c;
}


.container,
.container-lg,
.container-md,
.container-sm,
.container-xl {
  width: var(--max-website-width);
  max-width: 95%;
}

.shadow-sm {
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .15) !important
}

.navbar:first-child {
  position: var(--navbar-position);
  top: 0;
  background: linear-gradient(#7777770d, #7777770d), var(--app-background);
  z-index: 5;
}

#app {
  background-color: var(--app-background);
}

div.card {
  background-color: #7771;
}

.border-secondary {
  border-color: #7773 !important;
}

.btn-secondary {
  background-color: var(--button-color);
  border-color: var(--button-color);
}

.custom-select {
  border-color: var(--button-color);
  background: var(--button-color) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23909090' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right .75rem center/8px 10px
}

.btn-outline-secondary {
  color: var(--gray);
  border-color: var(--button-color);
}

.btn-outline-secondary:not(:disabled):not(.disabled).active,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.show > .btn-outline-secondary.dropdown-toggle,
textarea.form-control,
.form-control {
  background-color: var(--button-color);
  border-color: var(--button-color);
}

.btn-secondary:hover,
.btn-outline-secondary:hover,
.form-control:focus {
  background-color: var(--button-focus);
  border-color: var(--button-focus);
}

.btn-secondary.disabled,
.btn-secondary:disabled {
  background-color: var(--button-color);
  border-color: var(--button-color);
  opacity: 0.6;
}

.form-control:focus {
  box-shadow: 0 0 0 .2rem #ffffff0d;
}


.dropdown-divider,
.border-light {
  border-color: #ffffff17 !important;
}

.bg-secondary {
  background-color: var(--button-color) !important;
}


.bg-light {
  background-color: #ffffff0d !important;
}

.choices[data-type*="select-one"]::after {
  border-top-color: var(--gray);
}

.is-open .choices__list--dropdown,
.is-open .choices__list--dropdown[aria-expanded] {
  border-color: var(--button-color) !important;
  background-color: var(--button-color) !important;
}


.post-listing .vote-bar + .col-sm-2 {
  flex: 0 0 150px;
}

.tippy-box {
  background-color: var(--button-color);
}
.tippy-arrow {
  color: var(--button-color);
}

.table thead th,
.table td,
.table th {
  border-color: var(--light);
}

.text-muted {
  color: var(--gray) !important;
}

.text-primary {
  color: var(--text-primary) !important;
}


a {
  color: var(--link);
}
a:hover,
a:focus {
  color: var(--link-focus);
}


a.text-primary:focus,
a.text-primary:hover {
  color: var(--text-primary-focus) !important;
}

.mark, mark {
  background-color: var(--light);
}

Configuration for "rusty" colors:

:root {
  --navbar-position: sticky;
  --max-website-width: 1300px;
  --app-background: #421;
  --button-color: #532;
  --button-focus: #643;
  --light: #532;
  --gray: #987;
  --text-primary: #578abf;
  --text-primary-focus: #4077b1;
  --link: #00bc8c;
  --link-focus: #00bc8c;
}