The themer recommended in this issue takes a set of colors and generates editor themes, end themes, other application themes, and desktop/device wallpapers.

themer takes a set of colors and generates themes for your development environment (editor, terminal, wallpaper, etc.).

Install themer

Command line installation:

mkdir my-dotfiles & &  cd my-dotfiles
npm install themer

If you do not put your dotfiles under version control, you can simply use npm -g install themer.

themer can also be used without installation, via npx.

themer Usage

Pass themer a color set, any number of templates, and an output directory.

themer \
--colors < npm package name OR file>  \
--template < npm package name OR file>  \
[--template <npm package name OR file>...] \
--out < directory> 

The generated theme files and the README on how to install them are written to the output directory.

Sample workflow

Suppose you want to generate vim themes and desktop backgrounds using themer’s default color set.

First, install themer, color set, and template:

cd my-dotfiles
npm install themer @themerdev/colors-default  @themerdev/vim @themerdev/wallpaper-block-wave

Then edit your package.json:

  ...
"scripts": {
"build":  "themer -c @themerdev/colors-default -t @themerdev/vim -t @themerdev/wallpaper-block-wave -o  gen"
},
... 

Then run your new script:

npm run build

Now check gen/ the folder of the theme you generated with the following result:

Example Usage npx

npx \
-p themer \
-p @themerdev/colors-default \
-p @themerdev/vim \
-p @themerdev/wallpaper-block-wave \
themer \
-c @themerdev/colors-default \
-t @themerdev/vim \
-t @themerdev/wallpaper-block-wave \
-o output

Create your own color set

To create your own color set, create a JavaScript file that exports the colors object as follows:

module.exports.colors = {

// The color set can have both light and dark variants, but only one needs to be available. 
dark: {

// Colors can be defined in any valid CSS format. 

// 0-7 should be the main accent color of the subject. 
accent0: '#FF4050',
accent1: '#F28144',
accent2: '#FFD24A',
accent3: '#A4CC35',
accent4: '#26C99E',
accent5: '#66BFFF',
accent6: '#CC78FA',
accent7: '#F553BF',

// SHAde0-7 should be the same shade, where shade0 is. 
// Background, shade7 is foreground. If you omit. 
// Intermediate chrominance (1 to 6), they will be calculated for you automatically. 
shade0: '#282629',
shade1: '#474247',
shade2: '#656066',
shade3: '#847E85',
shade4: '#A29DA3',
shade5: '#C1BCC2',
shade6: '#E0DCE0',
shade7: '#FFFCFF'

  },

  light: { ... },

};

Pro tip: You can use themer’s Web UI to select colors more easily, then click the “Download” button to generate the colors.js file. Then passes the path of the JS file –colors to themer.

themer -c path/to/my/colors.js ... 

Official Example

1. Choose your color

2. Preview

—END—

Open Source protocol: MIT License