Add Badge

Node commands to add an overlay badge, inset to the non-transparent area.

| | | |------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------|

Installation

Using npm:

npm install --save-dev @sourcetoad/add-badge

Using yarn:

yarn add --dev @sourcetoad/add-badge

Usage

Add a badge to a single image:

npx add-badge <input-image> <output-image> <badge-text> [options]

Add a badge to multiple images, modifying them in-place:

npx add-badges <input-glob> <badge-text> [options]

See fast-glob for glob details.

Options

See samples for previews.

Font File --font-file

The font file path to use for the badge text.

Type: file
Default: Roboto Black (Bundled)

Font Size --font-size

The font size to use for the badge text. The size will be scaled up or down if the image is not 192px.

Type: point
Default: 28

Text Color --text-color

The color to use for the badge text. Use transparent for transparent text.

Type: color
Default: #666666

Background Color --background-color

The color to use for the badge background.

Type: color
Default: #ffffff

Shadow Color --shadow-color

The color to use for the badge shadow.

Type: color
Default: rgba(0,0,0,0.6)

Gravity --gravity

The gravity to use for the badge. The badge will be placed in the corner specified by the gravity.

Type: northwest | north | northeast | southwest | south | southeast
Default: southeast

Position --position

If set, the badge will be placed manually instead of automatically. If only one number is provided, the badge will be placed on the gravity axis at the position. If two are provided, the first will be the x position and the second will be the y position.

Numbers are in percent of the image's dimensions (integer).

Type: number | number,number
Default: undefined

Dry Run --dry-run/-d

If set, the command will only preview the files that would be changed.