Is there a dark theme for TiddlyHost available or indevelopment?

Title says it all, I was just curious because there is some css in the website from looking with the inspector for some support for it, and I am a fan of dark themes for things :smiley:

Clarification, I forgot to include “TiddlyHost” in the title and/or body, that is completely my bad!

You could start with GitHub - dracula/tiddlywiki: 🧛🏻‍♂️ Dark theme for TiddlyWiki
À Nice theme.

1 Like

There are several dark “themes” that are available by default in the TWCore.

Go to $:/ControlPanel > Appearance > Palette, and select any of the following:

  • Contrast (Dark)
  • Cupertino Dark
  • Gruvbox Dark
  • Nord
  • Solarized Dark
  • Spartan Night
  • Twilight

I’ve also created my own “dark theme”, here:

As well as some tools for selecting and constructing custom palettes:

  • TiddlyTools/Palettes/Chooser
    adds a TopLeftToolbar item for quickly switching between palettes
  • TiddlyTools/Palettes/Manager
    provides an improved $:/PaletteManager with extra features including:
    • “find matching classnames/colornames/colorvalues”
    • a “color map” for adjusting multiple palette entries at once
    • keyboard navigation (home,end,up,down,ctrl-up,ctrl-down,enter,escape)
    • undo (revert to previously saved palette color)
    • more compact layout
  • TiddlyTools/Settings/Colors/X11
    adds droplist support to TiddlyTools/Palettes/Manager for selecting colors by X11 Color Name (instead of entering RGB hex codes)
  • TiddlyTools/Palettes/Backgrounds and TiddlyTools/Stylesheet/Backgrounds
    adds support for assigning background images and extra styles to selected CSS classes/elements (e.g., .tc-body, .tc-tiddler-frame, pre, etc.)


1 Like

Apologies everybody, I should have clarified in the title, I had meant a dark theme for TiddlyHost, I tagged it but never meantioned that :sweat_smile:

Actually yes, I have used the dracula theme, it’s pretty appealing, I like it a lot on VSCode

For Tiddlyhost itself, I have an open issue for it, see #40.

1 Like

Awesome! I hope it’s fairly straight forward for you to implement :smiley:

In the meantime you could use an addon to apply a custom theme to tiddlyhost: Stylus ::

EDIT: @Justin_H Here’s a quick and dirty dark mode I made for tiddlyhost using this plugin:

/* ==UserStyle==
@name  - 1/13/2023, 4:15:26 PM
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */
@-moz-document domain("") {

    :root {
        --bs-light-rgb: var(--dark-background);
        --bs-body-color: var(--dark-foreground);
        /* $:/palettes/CupertinoDark */
        --dark-background: 40, 40, 40;
        --dark-foreground: white;
        --dark-link-foreground: #32D74B;
        --dark-link-foreground-visited: #BF5AF2;
        --dark-header-background: #111;

    .btn-light {
        --bs-btn-bg: transparent;
        color: var(--dark-foreground);
        svg {
        fill: var(--dark-foreground);

    .bg-light *:not([class*="tag"] *){

    .hub .site .name a,
    .sites-grid .site .name a {
        color: var(--dark-link-foreground)!important;

    :is(.hub .site .name a, .sites-grid .site .name a):visited {
        color: var(--dark-link-foreground-visited)!important;
    .bg-light header {

That looks pretty good, I did something similar by downloading a browser plugin called Dark Mode, and choosing Color inversion #5, which made it pretty suitable to look at.