A DomTerm terminal window is represented by <div> element
that has domterm in its class attribute.
The appearance of a window can be controlled by CSS stylesheets.
You can place stylesheet rules in the settings.ini file.
For example:
style.user=
|div.domterm { background-color: azure }
You can also change the stylesheets using domterm add-style or
domterm load-stylesheet sub-commands. For example:
$ domterm add-style "div.domterm { background-color: azure }"
By default DomTerm uses uses dark-colored (black) foreground (text) on a light-colored (off-white) background. Reverse video switches these, by using a light-colored text on a dark background.
You can enable reverse-video mode using the command:
$ domterm reverse-video on
or in the settings.ini file:
style.dark=on
Enabling reverse-video does not change stylesheet rules,
but instead sets the reverse-video attribute on the
top-level domterm element. This is used to select
differe stylesheet rules for reverse-video. For example
to change the background color input input lines
to a dark brown do this:
div.domterm[reverse-video] span[std="input"] { background-color: #808200 }
“Reverse-video mode” is any style where the background is darker than the foreground. You can tweak individual style elements to achieve such a style, but its better to first explicitly set reverse-video mode (perhaps using the above command), because that selects a consistent whole.
DomTerm makes uses of CSS Variables, which is supported by most modern browsers. The following variables define the main colors.
--main-light-colorA light color used for the default background in normal mode, or used for default foreground (text) in reverse-video mode.
--main-dark-colorA dark color used for the default foreground (text) in normal mode, or used for default background in reverse-video mode.
--background-colorThe color currently used for the main background.
Defaults to --main-light-color normally, or
--main-dark-color in reverse-video mode
(or after the SGR reverse-videa escape-sequence).
--foreground-colorThe color currently used for the main background (text).
Defaults to --main-dark-color normally, or
--main-light-color in reverse-video mode
(or after the SGR reverse-videa escape-sequence).
A common desire is to change the default background color. You can do any one of:
div.domterm { --main-light-color: azure } /* recommended method */
div.domterm { --background-color: azure }
div.domterm { background-color: azure }
Using --main-light-color is recommended because
it integrates better with the rest of the default stylesheets.
If you want to change to a dark background color, it is recommended to you enable reverse-video mode instead (or in addition).
The following color variables define the standard 16
“ANSI colors”:
--dt-black,
--dt-red,
--dt-green,
--dt-yellow,
--dt-blue,
--dt-magenta,
--dt-cyan,
--dt-lightgray,
--dt-darkgray,
--dt-lightred,
--dt-lightgreen,
--dt-lightyellow,
--dt-lightblue,
--dt-lightmagenta,
--dt-lightcyan,
--dt-white.
The default definitions mostly match xterm.
For example cyan is #00CDCD.
It you can to change it to the standard VGA color, you
can add an override rule:
div.domterm {--dt-cyan: #00AAAA}
The mc file browser by default sets the background to blue.
You can adjust the shade of blue used like this:
div.domterm {--dt-blue: #4040a0 }
DomTerm indicates the bottom area past the written data with pale “zebra stripes”. If you want to disable this, do:
div.domterm-spacer {background: none }
The spacer stripes alternatate between transparent and the value of --spacer-color. You can change it thus:
div.domterm-spacer {--spacer-color: LemonChiffon}
The main monospace text font is set by the --monospace-family variable.
For example:
div.domterm { --monospace-family: "FreeMono","DejaVu Sans Mono" }
The std attribute of a <span> element is used to
indicate the logical kind of output.
The attribute std='prompt' marks a prompt before an input line,
while std='prompt' marks the input line itself.
(These attribute can be set using escape sequences in the prompt.)
You can change the colors used like this:
span[std="prompt"] { background-color: lightgray }
span[std="input"] { color: blue; background-color: inherit }
Note the use of inherit to override the setting in the
default stylesheet.
If you want to change the style of the entire input line,
you can use the input-line property:
div.input-line { background-color: #FFFFE8 }
An application or library can use escape sequences to distinguish
the error output (stderr) from regular output (stdout).
(Most programs don’t emit these escape sequences.
It is difficult to do this reliably without modifying the
program or the tty subsystem.)
If so, by default, the text color is red; to turn this off, do:
span[std="error"] { color: inherit }
Setting a background image:
/* Note: browser security may disallow file: URLs. */
div.domterm {
background-image: url('file:/usr/share/backgrounds/gnome/Mirror.jpg');
opacity: 0.4 }
div.domterm-spacer {background: none } /* optional but recommended */
You can reduce the opacity to make the text more visible.
Note browsers may restrict the use of file: URLs
because of the same-origin policy.
Work-arounds are being considered; please contact the maintainer if this
is a feature you want.
You can change the look of the caret (text input cursor)
using the style.caret and style.edit-caret
settings in settings.ini.
style.caret =valuestyle.edit-caret =value
The style.caret setting is used for normal terminal “character” mode,
while style.edit-caret is used when the terminal is in line-edit mode
or the minibuffer.
The value can be one of these (unquoted) words:
block, blinking-block,
underline, blinking-underline,
bar, or blinking-bar.
(The experimental value native uses the native
text caret (a vertical bar, typically),
but does not work properly and it interacts awkwardly with the selection.)
The default is blinking-block for style.caret,
and blinking-bar for style.edit-caret
Note that
blinking-block, blinking-underline, and blinking-bar
only blink 20 times after each change or focus.
To change the number of blinks set the CSS variable --caret-blink-count.
For example to blink indefinitely, add this to settings.ini:
style.user= div.domterm { --caret-blink-count: infinite }
You can also change the character-mode caret style with an escape sequence (DECSCUSR). For example this shell command:
echo -en "\e[3 q"
changes the style to blinking-underline.
Instead of 3, you can use 0 (default - reset to the style.caret value), 1 (blinking-block), 2 (steady block),
3 (blinking-underline), 4 (steady underline), 5 (blinking-bar), 6 (steady bar), or 7 (native),
The Solarized colorscheme aims for muted balanced colors for both light and dark styles. Put the following in your Settings for a solarized dark look.
style.dark=yes
style.user=
| div.domterm { --solar-base03: #002b36; --solar-base02: #073642;
| --solar-base01: #586e75; --solar-base00: #657b83;
| --solar-base0: #839496; --solar-base1: #93a1a1;
| --solar-base2: #eee8d5; --solar-base3: #fdf6e3;
| --solar-yellow: #b58900; --solar-orange: #cb4b16; --solar-red: #dc322f;
| --solar-magenta: #d33682; --solar-violet: #6c71c4;
| --solar-blue: #268bd2; --solar-cyan: #2aa198; --solar-green: #859900 }
| div.domterm { --main-light-color: var(--solar-base3);
| --main-dark-color: var(--solar-base03) }
| div.domterm[reverse-video] { --background-color: var(--solar-base03);
| --foreground-color: var(--solar-base0) }
| div.domterm span[std="input"] { background-color: var(--solar-base2) }
| div.domterm[reverse-video] span[std="input"] {
| background-color: var(--solar-base02) }
| div.domterm-spacer {background: none }
| div.domterm div.input-line, div.domterm[reverse-video] div.input-line {
| background-color: var(--background-color); }
The above is merely a suggested start. The last few lines are optional. You might want to tweak prompt and error colors. You could also change the “standard” colors, for example:
| div.domterm {--dt-blue: var(--solar-blue) }
For a light solarized look, change the style.dark=yes
to style.dark=no.
Each window has various properties (see Sessions and Windows) that can be used to select a specific window or group of windows. You can use the following attributes to set different styles for different windows:
session-number=session-number
pid=pid
window-name=window-name
(but only if the window-name has been set).
For example:
div.domterm { background-color: #FFE }
div.domterm[session-number="1"] { background-color: #FEE }
div.domterm[window-name="compile"] { background-color: #EEF }
div.input-line { background-color: inherit }