ink-gradient

Gradient color component for Ink

Install

npm install ink-gradient

Usage

import React from 'react';
import {render} from 'ink';
import Gradient from 'ink-gradient';
import BigText from 'ink-big-text';

render(
	<Gradient name="rainbow">
		<BigText text="unicorns"/>
	</Gradient>
);

API

<Gradient>

It accepts a string or Ink component as children. For example, <Box/>.

Props

children

The content to colorize.

Multiple <Text> children are treated as separate nodes, which preserves layout when <Gradient> is placed inside a <Box flexDirection="column">.

If you want a continuous gradient across multiple lines, pass a single string or a single <Text> with \n.

name

Type: string

The name of a built-in gradient.

Mutually exclusive with colors.

colors

Type: string[] | object[]

Colors to use to make the gradient.

Mutually exclusive with name.

Related

• ink-big-text - Awesome text component for Ink
• ink-link - Link component for Ink