Stylog Console Styling

Chainable wrapper around LogStyler for styled console output supporting ANSI-16, HEX, RGB, and HSL colors.

Stylog

Acknowledgement

This utility is inspired by chalk.
It is neither a fork nor direct derivative but rather a simple alternative with a distinct philosophy and implementation.

The Stylog is a chainable wrapper around the LogStyler class that provides a fluent API for styling console output. It supports method chaining with style properties for all available colors and text effects.

When to Use

Use this when you want fluent, chainable styling
Perfect for one-off styled console messages
Great for quick debugging with colored output
If you need custom reusable style configurations, use LogStyler directly

Features

Fluent chainable API - Stylog.red.bold.bgBlue.log()
Type-safe autocomplete for all styles
Cross-platform (Node.js ANSI + Browser CSS)
Multiple color formats - ANSI-16, HEX, RGB, HSL
No configuration needed - just import and use

Import

import { Stylog } from 'toolbox-x/stylog';

Quick Usage

import { Stylog } from 'toolbox-x/stylog';

// Basic coloring
Stylog.red.log('Error message');
Stylog.green.log('Success message');
Stylog.blue.log('Info message');

Available Style Properties

Foreground Colors

All CSS color names as properties: .red, .blue, .green, .yellow, .purple, .aqua, .cornflowerblue, etc.

Please refer to CSS_COLORS for more details.

Background Colors

Prefixed with bg: .bgRed, .bgBlue, .bgGreen, .bgYellow, .bgDark, etc.

Text Effects

.bold, .bolder - Bold text
.dim - Dimmed text
.italic - Italic text
.underline - Underlined text
.strikethrough - Strikethrough text
.inverse - Inverted colors

Methods

`.style(style)`

Add a style and return a new LogStyler instance for chaining.

playground.ts

Notes

When chaining similar styles, only the last one(s) takes effect.
All colors applied through style() method are truecolor in form, to apply ANSI-16 colors, use ansi16() method.

`.ansi16(color)`

Apply ANSI 16-color styling to the text.

Parameters

Parameter	Type	Description
`color`	`Ansi16Color`	`ANSI 16-color` name (e.g., `'red'`, `'cyanBright'`)

Returns

StylogChain: A new chainable instance with the ANSI 16-color style applied.

Notes

Only one argument (color) can be passed on a single call.
Color applied through ansi16() method is truecolor in form.
For background ANSI colors, use bg prefix (e.g., 'bgRed').

Examples

playground.ts

`.hex(code)`

Apply a HEX color to the text foreground.

Parameters

Parameter	Type	Description
`code`	`string`	HEX color string (e.g., `'#4682B4'` or `'4682B4'`)

Returns

StylogChain: A new chainable instance with the HEX color applied.

Notes

Accepts both formats: with hash prefix (#4682B4) or without (4682B4).
Invalid HEX codes will be ignored (no error thrown).

Examples

playground.ts

`.bgHex(code)`

Apply a HEX color to the text background.

Parameters

Parameter	Type	Description
`code`	`string`	HEX color string (e.g., `'#4682B4'` or `'4682B4'`)

Returns

StylogChain: A new chainable instance with the HEX background color applied.

Notes

Accepts both formats: with hash prefix (#4682B4) or without (4682B4).
Invalid HEX codes will be ignored (no error thrown).

Examples

playground.ts

`.rgb(code)` | `.rgb(red, green, blue)`

Apply an RGB color to the text foreground.

Parameters (String version)

Parameter	Type	Description
`code`	`string`	RGB color string (e.g., `'rgb(11, 45, 1)'` or `'11, 45, 1'`)

Parameters (Component version)

Parameter	Type	Description
`red`	`number`	Red component (`0-255`)
`green`	`number`	Green component (`0-255`)
`blue`	`number`	Blue component (`0-255`)

Returns

StylogChain: A new chainable instance with the RGB color applied.

Notes

Accepts multiple formats: full rgb() syntax or comma-separated values.
Invalid RGB values will be ignored (no error thrown).

Examples

playground.ts

`.bgRGB(code)` | `.bgRGB(red, green, blue)`

Apply an RGB color to the text background.

Parameters (String version)

Parameter	Type	Description
`code`	`string`	RGB color string (e.g., `'rgb(225, 169, 196)'` or `'225, 169, 196'`)

Parameters (Component version)

Parameter	Type	Description
`red`	`number`	Red component (`0-255`)
`green`	`number`	Green component (`0-255`)
`blue`	`number`	Blue component (`0-255`)

Returns

StylogChain: A new chainable instance with the RGB background color applied.

Notes

Accepts multiple formats: full rgb() syntax or comma-separated values.
Invalid RGB values will be ignored (no error thrown).

Examples

playground.ts

`.hsl(code)` | `.hsl(hue, saturation, lightness)`

Apply an HSL color to the text foreground.

Parameters (String version)

Parameter	Type	Description
`code`	`string`	HSL color string (e.g., `'hsl(50 80.5% 40%)'` or `'50, 80.5%, 40%'`)

Parameters (Component version)

Parameter	Type	Description
`hue`	`number`	Hue component (`0-360`)
`saturation`	`number` or `string`	Saturation component (`0-100 or 0-100%`)
`lightness`	`number` or `string`	Lightness component (`0-100 or 0-100%`)

Returns

StylogChain: A new chainable instance with the HSL color applied.

Notes

Accepts multiple formats: standard HSL syntax or comma-separated values.
Internally converts HSL to RGB for rendering.
Invalid HSL values will be ignored (no error thrown).

Examples

playground.ts

`.bgHSL(code)` | `.bgHSL(hue, saturation, lightness)`

Apply an HSL color to the text background.

Parameters (String version)

Parameter	Type	Description
`code`	`string`	HSL color string (e.g., `'hsl(50 80.5% 40%)'` or `'50, 80.5%, 40%'`)

Parameters (Component version)

Parameter	Type	Description
`hue`	`number`	Hue component (`0-360`)
`saturation`	`number` or `string`	Saturation component (`0-100 or 0-100%`)
`lightness`	`number` or `string`	Lightness component (`0-100 or 0-100%`)

Returns

StylogChain: A new chainable instance with the HSL background color applied.

Notes

Accepts multiple formats: standard HSL syntax or comma-separated values.
Internally converts HSL to RGB for rendering.
Invalid HSL values will be ignored (no error thrown).

Examples

playground.ts

`.toANSI(input, stringify?)`

Returns the input as a styled string with ANSI escape codes.

Parameters

Parameter	Type	Description
`input`	`unknown`	Input to style before printing in the shell
`stringify`	`boolean` (optional)	Whether to apply `JSON.stringify()` before styling. Defaults to `false`

Returns

string: The styled string with ANSI escape codes.

Examples

playground.ts

Note

The .toANSI() method always returns ANSI-formatted strings, making it suitable for contexts where you need the styled string rather than direct console output.

`.toCSS(input, stringify?)`

Chainable method that returns a styled tuple [format, cssList] for browser environments.

Parameters

Parameter	Type	Description
`input`	`unknown`	Input to style before printing in the console
`stringify`	`boolean` (optional)	Whether to stringify objects. Defaults to `false`

Returns

[string, string[]]: Tuple with formatted string and CSS styles.

When to Use

Use this method for browser-specific styling needs, UI framework integration, or custom output handling.

Parameter	Type	Description
`input`	`unknown`	Value to print to console/shell
`stringify`	`boolean` (optional)	Whether to apply `JSON.stringify()` before printing. Defaults to `false`

Examples

playground.ts

Cross-Platform Support

import { Stylog } from 'toolbox-x/stylog';

// Uses ANSI escape codes for true-color support
Stylog.red.bold.log('Node.js styled output');

// Custom color formats also work
Stylog.hex('#FF5733').log('Custom hex in Node.js');
Stylog.rgb(255, 100, 50).log('Custom RGB in Node.js');

Need more control?

If you need programmatic control or isolated instances, use the LogStyler class directly:

playground.ts

See the LogStyler class docs for full details.

On this page