# Anatomy of a Dark Theme: Etna

> Anatomy of Etna, a dark IDE theme: basalt and volcanic ash for the frame, lava rose keywords, sulfur gold members and strings the grey of fresh ash.

- URL: https://codigrate.com/blog/anatomy-of-the-etna-theme
- Published: 2026-10-16
- Category: Inspiration
- Theme: [Etna](https://codigrate.com/theme?product=etna)
- Publisher: Codigrate (https://codigrate.com)

People in Catania do not call it Etna. They call it 'a Muntagna, the mountain, as if there were no other,
and from the city there really is not: it fills the whole sky to the north and west, and on a clear
evening you can see it smoking from almost any street. In 1669 it came down to them. A flank eruption
opened low on the southern slope, buried villages on the way, reached the walls of Catania and ran on
into the sea. Twenty four years later an earthquake flattened what was left, and the city was rebuilt
in the dark lava stone the mountain had given it, which is why so much of Catania is grey and black to
this day, with pale limestone around the windows and doors.

The Greeks put the forge of Hephaestus under the mountain, and the giant Typhon with it, pinned there by
Zeus and still turning over in his sleep. On the nights the Southeast Crater is active you can see why.
Fountains of lava go up hundreds of metres above the summit, the flows run orange down the black slopes,
and from Taormina or the coast road the whole mountain looks like a dark shape with a fire on top.
Codigrate's Etna theme is that view. What follows takes it apart color by color. It is the eleventh
nature theme in this series after [Aurora Borealis](https://codigrate.com/blog/anatomy-of-the-aurora-borealis-theme),
[Everest](https://codigrate.com/blog/anatomy-of-the-everest-theme), [Sequoia](https://codigrate.com/blog/anatomy-of-the-sequoia-theme),
[Autumn](https://codigrate.com/blog/anatomy-of-the-autumn-theme), [Roraima](https://codigrate.com/blog/anatomy-of-the-roraima-theme),
[Sakura](https://codigrate.com/blog/anatomy-of-the-sakura-theme), [Ocean](https://codigrate.com/blog/anatomy-of-the-ocean-theme),
[Salda](https://codigrate.com/blog/anatomy-of-the-salda-theme), [Reynisfjara](https://codigrate.com/blog/anatomy-of-the-reynisfjara-theme) and
[Spring](https://codigrate.com/blog/anatomy-of-the-spring-theme), and the ninth premium theme after Ocean, Salda,
[Prague](https://codigrate.com/blog/anatomy-of-the-prague-theme), [Sydney](https://codigrate.com/blog/anatomy-of-the-sydney-theme), Reynisfjara,
Spring, [Vienna](https://codigrate.com/blog/anatomy-of-the-vienna-theme) and [Madrid](https://codigrate.com/blog/anatomy-of-the-madrid-theme).
Reynisfjara is volcanic too, but cold: black sand and basalt columns at dusk. Etna is the same rock
while it is still burning.

## A Mountain At Night

The theme's own description sets the scene: Mount Etna's nighttime eruptions, an ashen basalt base with
the reds, oranges and golds of molten lava laid over it. The palette names read like a walk up the
mountain. Obsidian, Volcanic Ash, Basalt Grey, Ash Stone, Slag Grey, Smoke Grey, Graphite and Pumice are
the rock, from the black glass at the bottom to the light stone that floats. Smoke Veil and White Ash
are what hangs in the air above the crater. Lava Rose, Ember Coral, Molten Glow, Burnt Sienna and Ember
Bed are the fire, and Sulfur Haze and Sulfur Gold are the yellow crust that forms around the vents.
The last few names come from below the mountain: Ionian Blue for the sea at its foot and Vineyard
Green for the vines that grow on its black soil, where old lava has slowly turned into some of the most
sought after vineyard ground in Sicily.

The interface takes its two accents straight from the crater. Lava Rose [#D74C57](https://codigrate.com/tools/color/D74C57)
is the accent for links, changed settings and the line under the active tab, and Burnt Sienna
[#C66439](https://codigrate.com/tools/color/C66439) is its second, the color a progress bar fills with and a selected tool
window button turns. In the code the work is shared between a red [#E3636C](https://codigrate.com/tools/color/E3636C) for
the keywords and a sulfur gold [#E8C259](https://codigrate.com/tools/color/E8C259) for everything that belongs to an object.

## The Harmony: The Colors Of Hot Rock

Rock does not glow in just any color. It starts as a dull red somewhere above 500 degrees Celsius, turns
cherry and then orange as it heats, and goes yellow at around 1,100, which is roughly where fresh lava
leaves the vent. Etna's syntax is built on that scale. Keywords are the deepest red, a lava rose at 356
degrees. Tags are a faded coral at 4, globals ember coral at 8, static members a molten orange at 22,
annotations a burnt gold at 32, local variables a warm sand at 34, parameters sulfur haze at 40, and
instance fields and methods sulfur gold at 44. Almost every color in a file sits on one stretch of about fifty
degrees of the wheel, an [analogous harmony](https://codigrate.com/blog/introduction-to-color-harmony), and every one of them
is [warm](https://codigrate.com/blog/warm-and-cool-colors).

What I like about it is where the heat goes. The keywords, the words you see first, are the coolest of
the glowing colors, the red of a crust that is already setting. The hottest yellow is kept for fields
and methods, the members you reach into, so the further a line gets into the details of an object, the
brighter it burns. The [lightness](https://codigrate.com/blog/lightness) barely moves along the way: the reds sit between
64 and 66 percent and the oranges and golds between 62 and 71, so nothing in the code is much darker
than anything else and the hue does the work, not the brightness.

Two things step off the scale. Strings, numbers and escapes are an ash grey
[#B4ADAC](https://codigrate.com/tools/color/B4ADAC) with only 5 percent [saturation](https://codigrate.com/blog/saturation), and class names,
function names and constants are left a white ash [#DFD9D8](https://codigrate.com/tools/color/DFD9D8). In a theme where
everything else is fire, the values and the names are what the mountain throws out and leaves lying
around: grey, light and cold.

## Backgrounds, From Obsidian To Ash

Etna's backgrounds are four surfaces, and none of them has any real color:

- Input [#080808](https://codigrate.com/tools/color/080808), obsidian, for search fields and dialogs.
- Editor [#121111](https://codigrate.com/tools/color/121111), volcanic ash, the page the code is written on.
- Window [#1E1D1D](https://codigrate.com/tools/color/1E1D1D), basalt grey, for the tool windows and panels.
- Surface [#222121](https://codigrate.com/tools/color/222121), ash stone, the outer frame the whole window sits in.

They run from 3 to 13 percent lightness, and the saturation never goes above 3 percent. There is a hint
of red in each of them, enough that the grey reads as warm stone rather than cold steel, but you would
only notice it next to a true neutral. Compare that with [Vienna](https://codigrate.com/blog/anatomy-of-the-vienna-theme),
whose frame gets redder the further it is from the code. Etna does the opposite: the frame stays black
and grey all the way out, and all the color is kept for the code and the few marks the window makes on
it. Panels and frame are also almost the same, 12 and 13 percent, so the window reads as one dark slope
with the editor cut a little deeper into it. Hovering a row lifts it only to
[#191818](https://codigrate.com/tools/color/191818).

That restraint is what makes the one red background count. The active editor tab sits on Ember Bed
[#3F171A](https://codigrate.com/tools/color/3F171A), a dark red with 47 percent saturation, underlined in Lava Rose. It is
the only colored surface in the whole window, a single vent glowing in the rock, and it tells you which
file you are in before you read a word. Search matches in the interface glow Molten Glow
[#E67748](https://codigrate.com/tools/color/E67748).

Selections stay in the rock. A selected row in the project tree is smoke grey
[#444242](https://codigrate.com/tools/color/444242) edged in pumice [#807C7C](https://codigrate.com/tools/color/807C7C), and when the window
loses focus it drops to slag grey [#363434](https://codigrate.com/tools/color/363434) with a graphite edge
[#4C4A4A](https://codigrate.com/tools/color/4C4A4A). Selected text in the editor is [#343232](https://codigrate.com/tools/color/343232), and the
code stays readable on it at about 10.1:1. Search results in the code are a pale rose white
[#E7DADA](https://codigrate.com/tools/color/E7DADA) on [#3B3838](https://codigrate.com/tools/color/3B3838) edged in a dusty rose
[#C17F7F](https://codigrate.com/tools/color/C17F7F), and the word under the caret turns a warm cream
[#F7E6D4](https://codigrate.com/tools/color/F7E6D4) on [#43413F](https://codigrate.com/tools/color/43413F) where it is read and on
[#484644](https://codigrate.com/tools/color/484644) where it is written to. A matched brace is set in bold on a cooled lava
brown [#744D39](https://codigrate.com/tools/color/744D39).

The status colors come from around the mountain rather than out of it: Sulfur Gold
[#CDA337](https://codigrate.com/tools/color/CDA337) for warnings, Vineyard Green [#85B66F](https://codigrate.com/tools/color/85B66F) for success,
Ionian Blue [#6A96C8](https://codigrate.com/tools/color/6A96C8) for information and visited links, and Eruption Red
[#CF383C](https://codigrate.com/tools/color/CF383C) for errors.

## One Foreground, Several Voices

Code is written in a pale rose white [#F0E2E2](https://codigrate.com/tools/color/F0E2E2) at about 15:1 against the volcanic
ash, the highest contrast of any dark theme in this series so far, which a background this close to
black makes easy. The interface around it uses White Ash [#D5CFCF](https://codigrate.com/tools/color/D5CFCF) at about 10.9:1 on
the basalt panels, and one level down Smoke Veil [#B3AEAE](https://codigrate.com/tools/color/B3AEAE) for hints and secondary
labels at about 7.7:1.

Comments are where Etna is strictest. They are a cooled lava brown [#866A65](https://codigrate.com/tools/color/866A65) at
about 3.8:1, below the 4.5:1 the [readability post](https://codigrate.com/blog/introduction-to-readability) suggests for
body text. It is a choice, not an oversight: a comment in Etna reads as rock that has stopped glowing,
present but out of the way of the code around it. If you write long doc comments and read them as much
as the code, this is the one place the theme asks something of you. Line comments and doc comments are
set in italics, the tags inside doc comments are bold in the same brown, and block comments stay
upright, so a commented out chunk of code still looks like code.

The gutter goes darker than the editor, to [#0C0C0C](https://codigrate.com/tools/color/0C0C0C), so the code sits on a
slightly raised bed of ash. Line numbers are a dark ember red [#8D4449](https://codigrate.com/tools/color/8D4449), quiet at
about 2.9:1, and the number on the current line brightens to [#BC575E](https://codigrate.com/tools/color/BC575E), an ember
that catches when you move the caret onto it. The caret itself is a pale rose
[#CEA1A4](https://codigrate.com/tools/color/CEA1A4) over a current row [#1C1B1B](https://codigrate.com/tools/color/1C1B1B) that is barely
lighter than the page. Indent guides are drawn in [#201F1F](https://codigrate.com/tools/color/201F1F), and the guide of the
block you are in lifts to [#313030](https://codigrate.com/tools/color/313030).

## Syntax: Lava, Ember And Sulfur

Open a file and the mountain lights up:

- Keywords in lava rose [#E3636C](https://codigrate.com/tools/color/E3636C), the red of a flow at the edge where it starts
  to set.
- Instance fields and methods in sulfur gold [#E8C259](https://codigrate.com/tools/color/E8C259), and JavaScript member
  functions in a paler gold [#EDCF7E](https://codigrate.com/tools/color/EDCF7E), the hottest colors in a file.
- Parameters in sulfur haze [#E2BF79](https://codigrate.com/tools/color/E2BF79), and local variables in a warm sand
  [#DFB886](https://codigrate.com/tools/color/DFB886).
- Static fields and methods in molten orange [#E19060](https://codigrate.com/tools/color/E19060), set in italics, and global
  variables in ember coral [#F1735F](https://codigrate.com/tools/color/F1735F).
- Annotations in a burnt gold [#D2A26A](https://codigrate.com/tools/color/D2A26A).
- HTML and XML tags in a faded coral [#CF7D77](https://codigrate.com/tools/color/CF7D77), and attributes in a dark rust
  [#9A5F5F](https://codigrate.com/tools/color/9A5F5F).
- Strings, numbers and escapes in ash grey [#B4ADAC](https://codigrate.com/tools/color/B4ADAC).
- Class names, function names and constants in white ash [#DFD9D8](https://codigrate.com/tools/color/DFD9D8), and inline
  hints a shade lighter [#EDE0E0](https://codigrate.com/tools/color/EDE0E0).

Read a few lines and the logic of it shows. The structure of the code, its keywords and the names of
things, is red and white, the two colors you see from a distance. The values are grey and fall back.
Everything that moves through a function, the parameters, the locals, the fields and the methods you
call, is gold and orange, and that is where the eye ends up: on the parts of the code that change from
one run to the next, the way it ends up on the moving lava and not on the mountain.

## The Final Product

Here is Etna put back together. The basalt frame holds a JetBrains IDE with one ember red tab and
Sublime Text keeps the same lava on the same ash. Slack goes black and grey around the chat, Ghostty
prints in reds and golds on the volcanic ash, and in Rhino the viewports go dark with burnt sienna
marking the active tab and the snaps you have turned on.

<!--SHOTS-START-->
<div class="post-shots">
<figure><img src="https://codigrate.com/assets/themes/nature/etna-theme/jetbrains-screenshot-1.webp" alt="Etna theme in a JetBrains IDE" width="1200" height="787" loading="lazy"><figcaption>JetBrains</figcaption></figure>
<figure><img src="https://codigrate.com/assets/themes/nature/etna-theme/sublime-screenshot-1.webp" alt="Etna theme in Sublime Text" width="1200" height="787" loading="lazy"><figcaption>Sublime Text</figcaption></figure>
<figure><img src="https://codigrate.com/assets/themes/nature/etna-theme/slack-screenshot-1.webp" alt="Etna theme in Slack" width="1200" height="779" loading="lazy"><figcaption>Slack</figcaption></figure>
<figure><img src="https://codigrate.com/assets/themes/nature/etna-theme/ghostty-screenshot-1.webp" alt="Etna theme in Ghostty" width="1200" height="779" loading="lazy"><figcaption>Ghostty</figcaption></figure>
<figure><img src="https://codigrate.com/assets/themes/nature/etna-theme/rhino-screenshot-1.webp" alt="Etna theme in Rhino" width="1200" height="787" loading="lazy"><figcaption>Rhino</figcaption></figure>
</div>
<!--SHOTS-END-->

## Reading It Back

Taken apart, Etna is a mountain with a fire on top. The backgrounds are the rock, black and grey with
just enough warmth in them to read as stone, and they stay that way from the input fields to the edge of
the window. The syntax is the lava, one warm climb from red to sulfur gold that follows the colors of
rock as it heats, and the values and names are left the grey and white of ash. The only red surface in
the window is the tab you are working in.

It is a theme for late nights and long sessions, darker and quieter than most, with the heat kept
exactly where the work is. Etna is a premium theme: a paid plugin for JetBrains IDEs on the JetBrains
Marketplace and part of the All In One bundle, a one time purchase for Xcode, Zed, Sublime Text,
Ghostty, iTerm2, macOS Terminal, Claude Code, Slack, Rhino and Firefox from the Codigrate store, and a
LINE theme in the LINE theme shop, all from its [theme page](https://codigrate.com/theme?product=etna).

## Frequently Asked Questions

### What is the Etna theme?

Etna is one of Codigrate's premium dark nature themes, built around Mount Etna on a night when it is erupting: black basalt slopes, a glowing crater and embers drifting over the lava fields. The frame of the editor is ash and basalt, greys with almost no color in them, and the code is written on a volcanic ash black. The syntax is the lava: lava rose keywords, ember coral globals, orange static members and sulfur gold fields, methods and parameters, with strings and numbers left the pale grey of fresh ash.

### Why are the backgrounds in Etna almost colorless?

Because on the mountain at night the rock is black and only the lava glows. The input fields sit on obsidian #080808, the editor on volcanic ash #121111, the panels on basalt grey #1E1D1D and the outer frame on ash stone #222121, all between 3 and 13 percent lightness and all with a saturation of 3 percent or less. With the frame that quiet, every warm color in the theme reads as heat, and there is only one red background in the whole window: the ember bed #3F171A behind the active tab.

### How are the syntax colors chosen in Etna?

They follow the colors of hot rock. Keywords are the deepest red, a lava rose at 356 degrees, and the syntax climbs from there toward yellow the way glowing lava does as it gets hotter: ember coral globals at 8 degrees, orange static members at 22, annotations and local variables between 32 and 34, sulfur parameters at 40 and gold fields and methods at 44. That is an analogous harmony across about fifty degrees of the wheel. Strings and numbers step out of it on purpose and take an ash grey, so the values in a file look like what the mountain throws out rather than what flows from it.

### Where can I get the Etna theme?

Etna is a premium theme. On JetBrains IDEs it is a paid plugin on the JetBrains Marketplace and is also part of the All In One bundle. For Xcode, Zed, Sublime Text, Ghostty, iTerm2, macOS Terminal, Claude Code, Slack, Rhino and Firefox it is a one time purchase from the Codigrate store, delivered as a download, and the LINE version is sold in the LINE theme shop. All of them are linked from the Etna theme page.
