React unDraw

React component for unDraw illustrations.

Demo

https://justinlettau.github.io/react-undraw

Installation

npm install react-undraw --save

Usage

Import everything:

import Undraw from 'react-undraw';

<Undraw name="coding" />;

Import only what you need:

import { UndrawCoding } from 'react-undraw';

<UndrawCoding />;

Props:

| Prop | Type | Description | Default | | -------------- | -------- | ------------------------------ | --------- | | name | string | Illustration name, kebab-case. | n/a | | primaryColor | string | Illustration primary color. | #6c63ff | | height | string | Illustration height. | 250px |

See ILLUSTRATIONS.md for a full list of supported illustration names.

Override Default Props

import Undraw from 'react-undraw';

Undraw.setDefaultProps({ primaryColor: 'darkblue' });

Development

npm install
npm run build

To refresh the generated components:

• Update ./scripts/illustrations.json with any new illustrations.
• Run npm run refresh (from root) to generate files.