Skip to main content

/projects

Dracula Fluent Terminal

Official Dracula theme port for Fluent Terminal, part of an open-source color ecosystem used across 300+ apps and editors.

Link
draculatheme.com/fluent-terminal(opens in new tab)
Stack
  • Dracula Theme
  • Fluent Terminal

Palette

  • Pink

    #ff79c6

  • Purple

    #bd93f9

  • Green

    #50fa7b

  • Yellow

    #f1fa8c

  • Red

    #ff5555

  • Orange

    #ffb86c

  • Cyan

    #8be9fd

  • Foreground

    #f8f8f2

Case study

Dracula has 50+ official ports across editors, terminals, and IDEs. In 2018 Fluent Terminal didn't have one. I shipped the official port, and it's still on the catalog at draculatheme.com.

Context

Fluent Terminal was a community project built on Microsoft's Fluent Design System and UWP. It predated Windows Terminal by more than a year and supported themes via JSON, which made it a viable target for the Dracula catalog.

Themes shipped as flat JSON files listing hex values for every color slot the renderer cared about. There was no preprocessor, no template, no runtime. A theme was a static record. That made the porting work fundamentally a translation exercise: take the Dracula spec, place each color in the right Fluent slot, and validate the output against the workloads people actually run inside their terminals.

The Dracula catalog already had ports for iTerm, Konsole, Hyper, Terminal.app, and several X11 terminals. Each was a precedent for which Dracula color belonged in which ANSI slot. That precedent matters because users move between terminals: a developer running iTerm at home and Fluent at work expects red to mean error in both.

The port

Picking colors wasn't the work, the palette was set. The work was mapping the 16-cell ANSI grid into Fluent's JSON theme schema while preserving semantic intent.

Validation came from running the port against the workflows that exercise the palette: bat output, ls --color, git status under a prompt framework, build logs with their error and warning lines, and git diff. If any one reads wrong, the mapping is wrong.

{
  "Name": "Dracula",
  "Author": "Dracula Theme",
  "Colors": {
    "Foreground": "#F8F8F2",
    "Background": "#282A36",
    "CursorAccent": "#44475A",
    "Selection": "rgba(68, 71, 90, 0.5)",
    "Black": "#000000",
    "Red": "#FF5555",
    "Green": "#50FA7B",
    "Yellow": "#F1FA8C",
    "Blue": "#6272A4",
    "Magenta": "#FF79C6",
    "Cyan": "#8BE9FD",
    "White": "#D3D7CF"
  }
}
Dracula.flutecolors (excerpt). Blue maps to Dracula's Comment color since the spec defines no chromatic blue.

The contract

The Dracula spec defines red as error, yellow as warning, and those mappings hold across every editor and terminal a developer opens in a day. Each port enforces them inside its target schema.

Fluent Terminal was eventually superseded by Windows Terminal, but the port stayed in the catalog. As long as a target still supports the spec, its port belongs.