# react-native-color

> Color components for React Native

Latest version **0.0.10** (published 2017-11-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-color
pnpm add react-native-color
yarn add react-native-color
bun add react-native-color
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.10 |
| Published | 2017-11-24 |
| First published | 2017-11-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 201 |
| Author | hectahertz |
| Maintainers | hectahertz |
| Keywords | react-native, react, dialog, pop-up, popup, modal, color, picker |

## Links

- npm: https://www.npmjs.com/package/react-native-color
- Repository: https://github.com/hectahertz/react-native-color
- Homepage: https://github.com/hectahertz/react-native-color#readme
- Issues: https://github.com/hectahertz/react-native-color/issues
- npm.io page: https://npm.io/package/react-native-color

## Dependencies (3)

- [prop-types](https://npm.io/package/prop-types.md) ^15.6.0
- [tinycolor2](https://npm.io/package/tinycolor2.md) ^1.4.1
- [react-native-slider](https://npm.io/package/react-native-slider.md) ^0.11.0

## Alternatives

- [react-native-root-siblings](https://npm.io/package/react-native-root-siblings.md) — 102.9K weekly downloads
- [post-robot](https://npm.io/package/post-robot.md) — 93.7K weekly downloads
- [@praxisui/dialog](https://npm.io/package/@praxisui/dialog.md) — 2.0K weekly downloads
- [easy-toggle-state](https://npm.io/package/easy-toggle-state.md) — 350 weekly downloads
- [ngx-lightbox-evp](https://npm.io/package/ngx-lightbox-evp.md) — 19 weekly downloads

## Recent versions

- 0.0.10 (latest) — 2017-11-24
- 0.0.9 — 2017-11-23
- 0.0.8 — 2017-11-23
- 0.0.7 — 2017-11-23
- 0.0.6 — 2017-11-23
- 0.0.5 — 2017-11-23
- 0.0.4 — 2017-11-23
- 0.0.3 — 2017-11-23
- 0.0.2 — 2017-11-22
- 0.0.1 — 2017-11-21

## README

# <img alt="React Native Color" src="images/logo.png" width="193"/>

Color components for React Native. JavaScript-only, for iOS and Android.

[![npm version](https://img.shields.io/npm/v/react-native-color.svg)](https://www.npmjs.com/package/react-native-color)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![npm downloads](https://img.shields.io/npm/dm/react-native-color.svg)](https://www.npmjs.com/package/react-native-color)

## Example
- Run the example app [via Expo](https://expo.io/@hectahertz/react-native-color-example) or [check the code](example/App.js).

## SlidersColorPicker
Based on a [Dribbble concept](https://dribbble.com/shots/3959594-Color-Picker-Concept?utm_source=Twitter_Shot) by [Satyajit Sahoo](https://twitter.com/satya164).

![SlidersColorPicker](images/sliderscolorpicker.gif)


## Gradients
With a customizable number of steps, shape and direction.

![Gradients](images/gradients.png)

## Sliders
The simplest hue/staturation/value selectors!

![Sliders](images/sliders.png)

## Setup
```sh
yarn add react-native-color
```
Or, if you use npm, `npm i --save react-native-color`.

## Roadmap
- Make the color string editable
- Support different color modes for the return string of the pickers
- Support different color modes for the sliders of the <SliderPicker/>
- Gradient that mixes two colors
- Add documentation for the props
- Support for themes/render customizations
- Export separate components for a build-your-own philosophy
- Type with [Flow](https://flow.org/)

## Contact

[Tweet me @hectahertz](https://twitter.com/hectahertz)

---
_Source: https://npm.io/package/react-native-color · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._