Armand Philippot

Coldark

Project kind:
Theme
Published on:
Reading time:
4 minutes
Repository:
Coldark
Tag:
Themes

Table of Contents
  1. Introducing Coldark
    1. Two versions in 16 colors
    2. Supported languages
  2. Where to find Coldark?
    1. VS Code version
      1. Installation
      2. In pictures
        1. Light theme
        2. Dark theme
    2. PrismJS
    3. Bat
      1. Theme Activation
      2. In pictures
    4. GTKSourceView based tools
      1. Make themes available
      2. In pictures
    5. Terminal XFCE
      1. Installing themes
      2. In pictures
    6. Other variations

Introducing Coldark

Coldark is a blue-gray theme with two flavors: light (Coldark – Cold) and dark (Coldark – Dark). It is available in several tools, including VS Code. Although this is primarily a personal theme, I am open to criticism, suggestions, and contributions.

Two versions in 16 colors

For the color harmonization, I was inspired by the base16 project and the Nord theme. So, Coldark uses 3 different color palettes and each version is now limited to 16 colors, like base16. However, the use of colors varies a bit from the latter.

The first palette is common to both versions of the theme. It is a variation of Coldark’s main colors. It therefore remains in gray-blue tones. The other two take up the colors of the color wheel: we thus find red, orange, yellow, green, cyan, blue, purple and magenta. They each apply to a version of the theme.

Coldark Color Preview
Coldark colors

Regarding syntax highlighting, I tried to comply with the Web Content Accessibility Guidelines (WCAG) to ensure a minimum of contrast. I wanted a theme that complies with the AAA standard. In the end, it’s more complicated than that. The dark version complies with this standard. For the light version, in order to keep a diversity of colors and a certain consistency with the dark version, I had to make exceptions; we are rather on the AA standard.

Supported languages

I have only tested it on Linux and Windows with the languages I use frequently:

  • HTML
  • CSS / SCSS
  • Javascript / Typescript (including JSX / TSX)
  • JSON
  • YAML
  • PHP
  • Markdown
  • Bash script

I looked at its appearance with other languages, but, since I don’t use them, I don’t know if everything is consistent. Also, since I don’t have a Mac available, I couldn’t test with this operating system. Feel free to report any bugs.

Where to find Coldark?

VS Code version

Installation

To install it on VS Code, simply search for “coldark” in the marketplace (via the website or in the software). It is also available in the OpenVSX repositories if you are using an alternative version like VS Codium.

In pictures

Light theme
VS Code Home Screen Preview with Coldark Cold
Homepage
Previewing a CSS file in VS Code with Coldark Cold
CSS
Previewing a Javascript file in VS Code with Coldark Cold
JS
Previewing a PHP file in VS Code with Coldark Cold
PHP
Dark theme
VS Code Home Screen Preview with Coldark Dark
Homepage
Previewing a CSS file in VS Code with Coldark Dark
CSS
Previewing a Javascript file in VS Code with Coldark Dark
JS
Previewing a PHP file in VS Code with Coldark Dark
PHP

Screenshots were taken on Windows. On Linux, it is not possible to act on the title bar; it will be in the colors of your theme.

PrismJS

If you want to use Coldark with PrismJS, you will find it in the prism-themes repository.

To use it, you will need to download the file or copy the code into a CSS file. Then, just add the path of this file into your page with the Prism script. For example:

html
Copied!
 
<!doctype html>
<html>
  <head>
    ...
    <link href="themes/prism-coldark-cold.css" rel="stylesheet" />
  </head>
  <body>
    ...
    <script src="prism.js"></script>
  </body>
</html>

Bat

Theme Activation

Coldark is integrated directly into bat. To use it, please refer to the Bat documentation to make sure the following procedure is up to date.

You can check the list of themes with bat --list-themes. To activate a new theme permanently, you can either add export BAT_THEME="Coldark-Cold" to your shell file or set --theme="Coldark-Cold" in the bat configuration file.

In pictures

Previewing a Markdown file in Bat with Coldark Cold
Bat with Coldark Cold
Previewing a Markdown file in Bat with Coldark Dark
Bat with Coldark Dark

GTKSourceView based tools

Make themes available

For tools using GTKSourceView, like Mousepad or Gedit, you will find the necessary files in the Coldark repository.

To use the theme, you will need to download or copy coldark-cold.xml and/or coldark-dark.xml and place them in a ~/.local/share/gtksourceview-3.0/styles/ folder.

Depending on the version of GTKSourceView your software is using, you may need to place the themes in a different folder (e.g. ~/.local/share/gtksourceview-4.0/styles/). The themes should be compatible with GTKSourceView versions 2, 3, and 4.

In pictures

Previewing an XML file in Mousepad with Coldark Cold
Mousepad with Coldark Cold
Previewing an XML file in Mousepad with Coldark Dark
Mousepad with Coldark Dark

Terminal XFCE

For XFCE terminal you will also find themes in Coldark repository.

Installing themes

  1. Create the folder ~/.local/share/xfce4/terminal/colorschemes/ if it doesn’t already exist,
  2. Download or copy coldark-cold.theme and/or coldark-dark.theme from the repository,
  3. Place these files in the folder created in step 1,
  4. Open the XFCE terminal,
  5. Click on the Edit menu and then select Preferences,
  6. In the new window, select the Colors tab,
  7. You will see a drop-down menu labelled Select Preset. Clicking on it will bring up a list and you should now see Coldark - Cold and/or Coldark - Dark. Select the one you want to use.

In pictures

Coldark Cold preview in XFCE terminal
XFCE Terminal with Coldark Cold
Coldark Dark preview in XFCE terminal
XFCE Terminal with Coldark Dark

Other variations

The Coldark repository also lists a ZSH theme and a Firefox theme. However, I’m not sure if they are variations, although they use Coldark’s colors.

At the moment I have no plans to create a new port of Coldark. It might be the case when I use another tool that supports custom themes and uses a different format.

In the meantime, if you like the theme and want to adapt it for your tools, it is possible to do so. I tried to document the use of colors as best as possible on the Coldark repository. You can therefore use it as inspiration to create your own ports. To have them listed on the repository you can create a pull request or simply let me know and I will update the repository.