Skip to content
🎨 Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter & more
Branch: master
Clone or download
erkkaha and casesandberg (BlockPicker): fixes blockpicker input not working (#616)
setUpdatedValue on EditableInput had a check that checked props.label not being null
in BlockPicker case label was undefined which caused the onChange to be called with
and object instead of hex string.
Latest commit 0657c78 May 10, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
.storybook Clean Up Root & Remove Modules (#410) Sep 1, 2017
docs docs: attempt to fix build error Dec 20, 2018
examples Add react-color dependency in example apps Feb 17, 2018
scripts Move Webpack config back Sep 4, 2016
src (BlockPicker): fixes blockpicker input not working (#616) May 10, 2019
.babelrc Lib with Styles Maped Mar 7, 2016
.gitignore Clean Up Root & Remove Modules (#410) Sep 1, 2017
.travis.yml Add Canvas Renderer for SSR (#301) Dec 2, 2016 Create (#376) Jul 10, 2017
LICENSE License Aug 17, 2015 Update npm version badge in (#472) Feb 15, 2018
package.json 2.17.3 Apr 29, 2019
webpack.config.js Clean Up Root & Remove Modules (#410) Sep 1, 2017

React Color

Npm Version Build Status License Downloads

  • 13 Different Pickers - Sketch, Photoshop, Chrome and many more

  • Make Your Own - Use the building block components to make your own



Live Demo

Installation & Usage

npm install react-color --save

Include the Component

import React from 'react'
import { SketchPicker } from 'react-color'

class Component extends React.Component {

  render() {
    return <SketchPicker />

You can import AlphaPicker BlockPicker ChromePicker CirclePicker CompactPicker GithubPicker HuePicker MaterialPicker PhotoshopPicker SketchPicker SliderPicker SwatchesPicker TwitterPicker respectively.

100% inline styles via ReactCSS

You can’t perform that action at this time.