Introducing barva: A Modern Approach to Terminal colours
Introducing barva, a modern TypeScript library for adding colors to terminal output, with a simple and intuitive API.
In the world of terminal applications, colour and styling are essential for creating user-friendly interfaces, highlighting important information, and improving readability. Today, I’m excited to introduce barva , a new terminal colour library that brings a fresh approach to styling your command-line applications.
Barva is the Czech word for colour
A Fresh Perspective on Terminal Styling
There are several excellent terminal colour libraries available, so why create another one? barva was born from a desire to create a more intuitive API that leverages modern JavaScript features while maintaining high performance.
The key differentiator is barva’s use of template literals:
1import { red, bold, green } from 'barva';
2
3// Using template literals for a more natural syntax
4console.log(red`This text is red`);
5console.log(bold.green`This is bold and green`);
6console.log(red`Error: ${green`But this part is green`}`);
This approach creates a more readable, intuitive API that feels like a natural extension of JavaScript.
Key Features
🎨 Intuitive Template Literal API
Unlike traditional libraries that use function calls like red("text")
, barva uses JavaScript’s template literals to create a more natural syntax:
1// Traditional approach
2console.log(chalk.red('Error occurred'));
3
4// barva approach
5console.log(red`Error occurred`);
This small syntactic difference makes your code more readable, especially when working with variables:
1const name = 'John';
2const score = 95;
3
4console.log(blue`Player: ${bold`${name}`} scored ${green`${score}`} points`);
🌲 Tree-Shakable for Smaller Bundles
barva is fully tree-shakable, which means your bundler can eliminate unused code. If you only import the styles you need, your final bundle will be much smaller:
1// Only red and bold will be included in your bundle
2import { red, bold } from 'barva';
This is particularly important for modern web applications or Node.js tools where bundle size matters.
🔗 Intuitive Style Chaining
Combining styles is seamless and intuitive:
1console.log(red.bold`Important warning`);
2console.log(blue.underline.bgWhite`Highlighted information`);
The API reads naturally from left to right, making it clear what styles are being applied.
🪆 Nested Styling Done Right
barva handles nested styles elegantly:
1console.log(red`Error: ${blue.bold`Important details`} need attention`);
The text “Error:” and “need attention” will be red, while “Important details” will be blue and bold. This nesting works to any depth and with any combination of styles.
📦 Tiny Size, No Dependencies
barva is extremely lightweight:
- Zero dependencies
- Only 3.9KB minified
- 1.8KB gzipped
- Even smaller with tree-shaking
🛡️ TypeScript Ready
barva comes with complete TypeScript definitions, providing excellent IDE support and type safety:
1import { red, blue, colourFunction } from 'barva';
2
3// TypeScript knows this is a string
4const errorMessage: string = red`Error occurred`;
5
6// You can also type the colour functions
7const createWarning = (message: string, colourizer: colourFunction) => {
8 return colourizer`Warning: ${message}`;
9};
👌 Environment Aware
barva is smart about when to apply colours:
- Automatically detects TTY support
- Respects the NO_colour standard
- Provides manual control with
setEnabled()
1import { setEnabled, red } from 'barva';
2
3// Manually control colour output
4setEnabled(false);
5console.log(red`This will not be coloured`);
6
7setEnabled(true);
8console.log(red`This will be coloured`);
Complete Style Support
barva supports the full range of terminal styles:
Text colours: black, red, green, yellow, blue, magenta, cyan, white, grey/gray
Background colours: bgBlack, bgRed, bgGreen, etc.
Bright Variants: redBright, greenBright, bgBlueBright, etc.
Modifiers: bold, dim, italic, underline, inverse, hidden, strikethrough
Performance: Speed Matters
Performance was a key consideration in barva’s design. The library uses several optimizations:
- Cached colourizer functions
- Pre-allocated arrays for string assembly
- Fast path for disabled colours
- Efficient handling of nested styles
These optimizations ensure that barva remains fast even with complex styling.
Getting Started
Installing barva is simple with your preferred package manager:
1# npm
2npm install barva
3
4# yarn
5yarn add barva
6
7# pnpm
8pnpm add barva
9
10# bun
11bun add barva
Then import just what you need:
1// Import individual styles (best for tree-shaking)
2import { red, green, bold } from 'barva';
3
4// Or import everything
5import barva from 'barva';
Real-World Example
Here’s a more complex example showing how barva can be used to create an informative CLI output:
1import { red, green, yellow, blue, bold, dim, grey } from 'barva';
2
3// Function to format a log message
4function formatLog(level, message, details = null) {
5 const timestamp = new Date().toISOString();
6
7 let levelIndicator;
8 switch (level.toLowerCase()) {
9 case 'error':
10 levelIndicator = red.bold`[ERROR]`;
11 break;
12 case 'warning':
13 levelIndicator = yellow.bold`[WARNING]`;
14 break;
15 case 'info':
16 levelIndicator = blue.bold`[INFO]`;
17 break;
18 case 'success':
19 levelIndicator = green.bold`[SUCCESS]`;
20 break;
21 default:
22 levelIndicator = dim`[LOG]`;
23 }
24
25 let output = `${dim`${timestamp}`} ${levelIndicator} ${message}`;
26
27 if (details) {
28 output += `\n ${dim.grey`→ ${details}`}`;
29 }
30
31 return output;
32}
33
34// Usage
35console.log(formatLog('error', 'Failed to connect to database', 'Connection timed out after 30s'));
36console.log(formatLog('success', 'User profile updated'));
37console.log(formatLog('warning', 'File locked', 'locked files can not be deleted'));
38console.log(formatLog('info', `Processing ${bold`23`} pending transactions`));
This creates beautiful, informative logs with clear visual hierarchy.
Why Choose barva?
With several colour libraries available, why consider barva?
Modern API: The template literal approach is more intuitive and readable.
Bundle Efficiency: Tree-shaking support means you only pay for what you use.
Performance: Careful optimizations ensure excellent performance.
TypeScript First: Built with TypeScript for excellent IDE integration.
Simplicity: Focused solely on terminal colours with zero dependencies.
Conclusion
barva represents a modern approach to terminal styling that prioritizes developer experience without sacrificing performance. By leveraging JavaScript’s template literals, it provides an API that feels natural and intuitive.
Whether you’re building a CLI tool, a server application with informative logs, or just want to add some colour to your terminal output, barva offers a fresh perspective on terminal styling.
Try it today and let me know what you think!
1npm install barva
2
3// or use yarn
4yarn add barva
Visit the GitHub repository or the npm package page for more examples, documentation, or to report issues. Contributions are of course always appreciated.