react-open-doodles
Version:
A Free Set of Sketchy Illustrations provided by https://www.opendoodles.com/
64 lines (48 loc) • 1.78 kB
Markdown
<h1 align="center">Welcome to react-open-doodles 👋</h1>
<p>
<a href="https://badge.fury.io/js/react-open-doodles">
<img src="https://badge.fury.io/js/react-open-doodles.svg" alt="npm version" height="18">
</a>
<a href="#" target="_blank">
<img alt="License: MIT" src="https://img.shields.io/badge/License-MIT-yellow.svg" />
</a>
<a href="https://twitter.com/oilunabr" target="_blank">
<img alt="Twitter: oilunabr" src="https://img.shields.io/twitter/follow/oilunabr.svg?style=social" />
</a>
</p>
> A Free Set of Sketchy Illustrations provided by [opendoodles](https://www.opendoodles.com)
<p align="center" >
<img src="https://opendoodles.s3-us-west-1.amazonaws.com/coffee.gif" width="500" >
</p>
Open Doodles was created by [Pablo Stanley](https://twitter.com/pablostanley) we use this Illustrations on our site [oiluna.com](https://oiluna.com).
This package is only a utility to use the illustrations in your React project.
```bash
npm install --save react-open-doodles
// or
yarn add react-open-doodles
```
```tsx
import React, { Component } from "react";
import { LovingDoodle } from "react-open-doodles";
export default class App extends Component {
render() {
return (
<div>
<LovingDoodle />
<LovingDoodle accent="#ff0083" ink="#484848" />
</div>
);
}
}
```
You can see all illustrations here: https://www.opendoodles.com
This a list of props that you can pass down to the component:
| Property | Description | Default value | type |
| -------- | ------------ | ------------- | ------ |
| `ink` | ink color | `
| `accent` | accent color | `
Give a ⭐️ if this project helped you!