Beautiful • Flexible • Type-Safe

react-beautiful-color

The most flexible and beautiful color picker for React

Why Choose React Beautiful Color?

Built for developers who care about flexibility, performance, and beautiful user experiences.

Compound Components

Compose your own layout with flexible compound components. No rigid UI constraints.

Beautiful Design

Clean, modern UI that fits any design system. Built with Tailwind CSS for easy customization.

Powerful Hook

useColorState hook with all color formats instantly available and complete type safety.

Lightweight

Pure Tailwind CSS with no external dependencies. Small bundle size, maximum performance.

Type-Safe

Full TypeScript support with discriminated unions for color inputs and complete type safety.

Eye Dropper

Built-in eye dropper support for picking colors from anywhere on the screen.