Anatomy of a Dark Theme: Miami

The pink on Ocean Drive is younger than the buildings. When the Art Deco hotels of South Beach went up in the 1930s, most of them were white, cream and beige. The pastels came decades later, in the early 1980s, when the designer Leonard Horowitz drew up a palette of about forty colors from the sunset, the sunrise, the ocean in summer and in winter, and the sand, then tried it first on a plain white bakery at the corner of 7th and Washington. The city has been wearing its own sky ever since.

Codigrate's Miami theme borrows from the same sky, only a little later in the evening. The sunset over Biscayne Bay is still there in the corals and the sand gold, but the sun is down, the neon is on and the room has gone dark. What follows takes it apart color by color. It is the first city in this series after six nature themes, and by some distance the loudest; the CMYK post already read its pink, aqua and gold as a drawer of printing inks, and this one reads them as a place.

Two Miamis In One Palette

The theme's own description names both halves in one line: electric nights and pastel sunsets. You can see both in the palette before a single file is open.

The pastel Miami is the sunset. A coral haze #F2A4A0, a sunset coral #FE8078, a golden sand #F8D273 and a pale art deco blue #92B5E8, the kind of colors Horowitz put on the facades, soft and full of light. The electric Miami is the night. A hot Miami pink #FF5FA2 runs through the interface as the accent, a flamingo pink #FE788C glows like a sign over a door, and an electric aqua #00D1C1 sits in the code like a hotel pool lit after dark.

The dark itself belongs to neither. It is the stretch between them, the few minutes after sunset when the clouds over the bay turn from pink to wine.

The Harmony: Pink Against Teal

Put the colors on a wheel and they gather in two places. The pinks, corals and the raspberry backgrounds crowd between roughly 325 and 5 degrees. The aquas and teals sit near 175 to 190, with the palm green a little before them and the art deco blue a little after. The two clusters are about 165 degrees apart, close to a complementary pair.

Pink against teal is the pairing Miami is known for, on the facades, on the tiles, in the neon over the entrances, and it works on a screen for the same reason it works on a building. Each color pushes the other further into itself: the coral reads warmer beside the aqua, and the aqua reads cooler beside the coral. The golden sand stands just outside both clusters at 43 degrees, which is why strings, the one family painted in it, are the easiest thing on the page to find.

Backgrounds, Mixed From Wine

A dark theme lives on its near blacks, and Miami's are not black at all. All four sit on the same raspberry hue, near 340 degrees, and only the lightness moves:

  • Input #270D16, the darkest well, where you type into search fields and dialogs.
  • Editor #33121D, the deep wine the code is written on.
  • Window #532033, a plum night for the tool windows and panels.
  • Surface #5D263A, the outer frame the whole window sits in.

The step from editor to window is wide enough that the code reads as its own pane without a single border line. Selection stays in the family too: selected text in the editor turns a magenta plum #5D224D, and a selected row in the project tree turns berry #722E47.

The one break is the open tab. The active editor tab sits on a deep lagoon teal #03534D with a tropical teal underline #059086, and the progress bar runs in a bright teal #17C7AC. In a room built entirely from warm tones, that single cool light tells you where you are at a glance.

One Foreground, Several Voices

The text is not pure white either. Code is written in a pearl #E4E1E2, a white with the faintest pink in it, at about 13:1 against the editor. That is plenty to read all night, and a step below the glare of pure white on a dark screen. The interface text around it is a pearl pink #D5C6CE and, one level down, a dusty orchid #CCA2B6, so labels, menus and secondary lines all come from the same warm family.

Comments break the pattern on purpose. They are a lavender grey #928BAA at around 5:1, set in italics, and the only cool neutral in the whole theme. Among so many warm tones that coolness alone is enough to push your notes behind the code. It is the same ladder from the readability post, with temperature doing part of the work that brightness usually does.

The small parts of the editor stay in character as well. The caret is pink #E17CBF, the line numbers are raspberry #B9285E, and the number on the current line lifts to a brighter #CA3C72, so the gutter glows faintly, like a sign seen from down the street.

Syntax: Neon And Tropics

Open a file and both Miamis show up at once:

  • Keywords in coral haze #F2A4A0, a pastel rather than a neon. They are the most frequent colored words in any file, so they get the softest warm tone in the set.
  • Methods and fields in sunset coral #FE8078, a shade hotter, for the things your code calls and reads.
  • Strings and numbers in golden sand #F8D273, the brightest syntax color in the theme, the low sun on the water.
  • Tags in flamingo #FE788C and global variables in orchid #DA78B0, the neon along the strip.
  • Parameters in electric aqua #00D1C1 and attributes in a pool blue #5DCCE4, the lights under the water.
  • Local variables in palm green #82D59F, the fronds against the dusk.
  • Static members in an italic art deco blue #92B5E8, a pale facade color, set apart by slant as well as by hue.

Class names, function names and constants stay a plain light grey #E0E0E0. Leaving the names uncolored is what keeps a Miami file readable. The eye takes in the shape of a line first, keyword, name, value, and the neon only lands where it has something to say.

Explore Our Themes

Reading It Back

Taken apart, Miami is a set of careful decisions dressed for a night out. The darks share one hue so the pinks have somewhere to sit. The hottest pink is saved for the accent and the caret, while the keywords that fill every line get a pastel. The one bright gold is spent on strings, the tokens you most often scan for. The aquas and greens are the counterweight that keeps a pink theme from turning into one long glow, and the comments step back by temperature instead of fading out.

It suits a dim room and a long evening, which is also when the real city looks like this. Miami installs free on JetBrains, VS Code, Cursor, Sublime Text, Chrome, Slack, Ghostty, iTerm2, macOS Terminal and Rhino, all from its theme page.

Codigrate

Codigrate