Color picker

A circular color picker using Motion for React, with swatches that react to pointer movement with soft springs.

, inspired by

Motion Studio

Enhance your AI code editor with this example

Use Motion Studio to create new components or infuse static designs with animations based on "Color picker" and 330+ other examples.

Discover Motion Studio

Create custom cursor and follow-along effects in React.

Animate elements with a declarative API. Supports variants, gestures, and layout animations.

Composable animatable values that can updated styles without re-renders.

A spring-powered motion value. Standalone or attach to another motion value.

Transform the output of one motion value into a new motion value.

Create React animation with Motion components. Learn variants, gestures, and keyframes.

An overview of all the gestures available in Motion for React.

Create custom cursor and follow-along effects in React.

Animate elements with a declarative API. Supports variants, gestures, and layout animations.

Composable animatable values that can updated styles without re-renders.

A spring-powered motion value. Standalone or attach to another motion value.