Animated Color Picker Components

Dev Design Library indexes 13 Animated color picker components from 11 open-source UI libraries, with the most coming from beUI, ReUI, Cult UI, Nexvyn UI and 23rd.dev. Each one links to its page with the source code, a live preview where available, the library license and the install command. These are the color picker components tagged as animated: motion on hover, on scroll or on load, usually built with CSS transitions or Framer Motion. Color picker components belong to the Inputs group.

• Color PickerCult UI · ReactInteractive color picker component with HSL support and preset colors
• Brand scaleReUI · React11 shades from 50 to 950 generated in OKLCH from one base color, copied as CSS variables.
• Color PickerbeUI · ReactA popover picker with a loupe under your finger.
• Color SelectorSpell UI · ReactInteractive color picker component.
• Swatch PickerKinetics · HTML/CSSSelected colour springs up with a check
• Spell Color SelectorAnimations (Svelte) · Svelte
• Color PickerNexvyn UI · ReactA blossom-style color picker with concentric petal layers, circular color bar, and arc slider for lightness control.
• Gooey Color Picker23rd.dev · ReactA floating color picker with a circular hue wheel, alpha slider, hex field, and motion-powered open/close.
• Color pickerArc Library · ReactA swatch that grows into a picker with format morphing, eyedropper, saved swatches, and contrast readout.
• Color PickerUI Lab · ReactDrag a color out of the square, then fine-tune hue and opacity.
• Color PickerReactFrame · ReactA color picker with a draggable saturation/brightness area, hue and opacity sliders, hex input, preset swatches and an…
• OpacityReUI · ReactA banner overlay with an opacity slider and field, written as rgb() with alpha.
• Color SelectorbeUI · ReactComposable color swatches with a spring-gliding selection ring, press feedback, native radio keyboard navigation, and…

Libraries with Animated color picker components

• beUI
• ReUI
• Cult UI
• Nexvyn UI
• 23rd.dev

Related categories

• Color Picker Components
• React Color Picker Components
• Tailwind CSS Color Picker Components
• shadcn/ui Color Picker Components
• Animated Input Components
• Animated Text Input Components
• Animated Select Components
• Animated Slider Components
• Animated Switch Components
• Animated Form Components
• Animated Textarea Components
• Animated Search Input Components
• Animated Checkbox Components
• Animated Segmented Control Components
• Animated Form Field Components
• Animated Rating Components
• Animated File Upload Components
• Animated Range Slider Components
• Animated Wheel Picker Components
• Animated Knob Components