sindresorhus/ink-gradient

Gradient color component for Ink

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

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

ink-gradient's Issues

broken gradient when packaged with vercel/pkg

Tried node 14 & 16, different gradient names. Any hints?

Can't flow vertically

I am using over some s and inside a with flexDirection "column" and things are not flowing correctly:

<Box borderStyle="single" flexDirection="column">
        <Gradient flexDirection="column" colors={["red", "blue"]}>
            {lines.map((t, i) => <Text key={i}>{t}</Text>)}
        </Gradient>
</Box>