# Priduck Color Theme

_A CLI for generating a tri-color theme based on a single hue and an even rotation around the color wheel._

Priduck (name is nonscense) is a color theme originally designed for [Fedran](https://fedran.com) where the base color is a hue (in degrees, 0-360) with with nine colors based on an even distribution around the wheel with nine-levels of brightness ranging from a near-black to a near-white.

## Installation

This tool is currently not available on npmjs. To install it, modify your project's `.npmrc` file to include:

```
@priduck-color-theme:registry=https://src.mfgames.com/api/packages/priduck-color-theme/npm/
```

Once that is done, the CLI can be installed as a development package with `npm`:

```shell
npm install --only-dev @priduck/cli`
```

Once installed, this will produce a CLI in the `node_modules/.bin` folder called `priduck`.

## Commands

### css mixin

Combines a number of CSS style fragments together and intersperses them in a manner that supports `prefers-color-scheme` and `prefers-contrast` in the various methods to support no preferences or a preference in one or more of the options.

For purposes of the read me file, an example of use has to suffice.

```shell
priduck css mixin --selector :root --output examples/theme.css --light examples/light.css --light-more-contrast examples/light-more-contrast.css --light-less-contrast examples/light-less-contrast.css --dark examples/dark.css --dark-more-contrast examples/dark-more-contrast.css --dark-less-contrast examples/dark-less-contrast.css
```

If a fragment isn't included, then it isn't used. So to generate an output file that defaults to dark mode and honors `prefers-color-scheme`, the command

```shell
priduck css mixin --selector :root --output examples/theme.css --light examples/light.css --dark examples/dark.css --output style.css
```

The fragment files can either be a bare set of CSS properties, or they can use a pseudo-selector of `:theme`.

```css
:theme {
  color: red;
}
```

```css
color: red;
```

There is no parsing of CSS, so this can also be used with Sass or Less or Postcss.

### css variables [--hue HUE] [--output PATH] [--selector SELECTOR]

Generate a CSS file using variables. The thirty colors all follow the pattern of `--color-priduck-cXbY` where `X` is a number between 0 and 9 (inclusive) and `Y` is the brightness (also in the range of 0 to 9, inclusive).

All of the colors are calculated based on the variable `--color-priduck-hue`, which is not included by default. If `--hue` is provided with a number between 0 and 360, then `--color-priduck-hue` will be set to the given color.

If `--selector` is included, the colors will be wrapped in a selector and slightly indented:

```css
// priduck css variables
--color-priduck-c0b0: lch(5.0 50.0 calc(var(--color-priduck-hue) + 0));
--color-priduck-c0b1: lch(15.0 45.0 calc(var(--color-priduck-hue) + 0));
```

```css
// priduck css variables --selector ":root"
:root {
  --color-priduck-c0b0: lch(5 50 calc(var(--color-priduck-hue) + 0));
  --color-priduck-c0b1: lch(15 45 calc(var(--color-priduck-hue) + 0));
}
```

### palette gpl --hue HUE [--output PATH] [--secondary 5] [--tertiary 8]

Generate a GNU Imp or Inkscape file. `--hue` is required in this situation. This assumes up to two additional colors (secondary, and tertiary).

Both of these are numbers in the range of 0-9 with 0 being an identical color to the base hue (which is always 0).

## Debugging

The CLI uses [debug](https://github.com/debug-js/debug) for logging and (relatively) minor output. The CLI will produce no output unless the `DEBUG` environment variable is set, such as:

```shell
export DEBUG="*"
```