Animated Checkbox Components

Dev Design Library indexes 27 Animated checkbox components from 20 open-source UI libraries, with the most coming from Fluid Functionalism, MicroKit, UI Lab, ReactFrame and Sora UI. 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 checkbox components tagged as animated: motion on hover, on scroll or on load, usually built with CSS transitions or Framer Motion. Checkbox components belong to the Inputs group.

• Spring CheckReact Bits · ReactCheckbox row where a single spring fills the box, draws the tick, strikes the label and dims the words in one press.
• Checkbox Checktransitions.dev · HTML/CSS
• CheckboxbeUI · ReactForm choice control with a draw-on checkmark, spring press feedback and indeterminate state support.
• Task ListRare UI · ReactA checklist that strikes out completed tasks and moves them to the bottom of the list.
• Task CheckboxSpectrum UI · ReactA satisfying todo checkbox row with spring fill, drawn-in check, confetti burst and animated strikethrough
• Animated CheckboxSpell UI · ReactAnimated checkbox with spring transitions and strike-through text effect.
• CheckboxFluid Functionalism · ReactA single checkbox: a hairline square that darkens on hover and a check that draws itself. Pairs with Field. Radix…
• CheckboxPanel UI · React NativeAnimated checkbox, as a row or a selectable card.
• Checkbox DrawKinetics · HTML/CSSThe tick is drawn with an animated SVG stroke
• Spell Animated CheckboxAnimations (Svelte) · Svelte
• CheckboxNexvyn UI · ReactA checkbox with drawn check animation, indeterminate state, and hidden native input for forms.
• Animated CheckboxSona UI · ReactAn accessible Base UI checkbox with a drawn checkmark and a restrained animated state change.
• Checkbox GroupUI Lab · ReactCheck marks draw themselves in, and Shift-click fills a range.
• CheckboxHextaUI · ReactA checkbox whose check draws in, with indeterminate parents, groups and labels that share its hover.
• Bounce CheckboxMicroKit · ReactA checkbox whose fill springs out past the box with a little swell, draws its tick, then strikes the label through and…
• Interactive ChecklistSpaceUI · React
• Base CheckboxSora UI · ReactAn accessible, stylable checkbox built on Base UI with a Motion-friendly animated indicator.
• Liquid CheckboxLiquefy UI · ReactCheckbox in liquid glass style.
• CheckboxEaseUI · ReactCheckbox on a real checkbox input, with a check mark that pops in rather than just appearing.
• Animated CheckboxReactFrame · ReactAn accessible checkbox with an animated draw-in checkmark, focus ring, and optional label, helper text, required…
• Checkbox (Base UI)Fluid Functionalism · ReactA single checkbox: a hairline square that darkens on hover and a check that draws itself. Pairs with Field. Base UI…
• Scribble CheckboxUI Lab · ReactChecks itself off with a quick pen stroke and strikes the words through.
• Progress Ring CheckMicroKit · ReactA task status icon whose dashed ring closes into a spinning arc, fills to its progress, then draws a check or a cross…
• Radix CheckboxSora UI · ReactAn accessible, stylable checkbox built on Radix UI with a Motion-friendly animated indicator.
• Tree ViewReactFrame · ReactA hierarchical tree with expand/collapse, tri-state checkboxes for multi-select, single-row selection, guide lines and…
• Checkbox GroupFluid Functionalism · ReactAnimated checkbox group with fluid hover, contiguous selection merging, and spring-animated check marks. Built on…
• Checkbox Group (Base UI)Fluid Functionalism · ReactAnimated checkbox group with fluid hover, contiguous selection merging, and spring-animated check marks. Base UI flavor.

Libraries with Animated checkbox components

• Fluid Functionalism
• MicroKit
• UI Lab
• ReactFrame
• Sora UI

Related categories

• Checkbox Components
• React Checkbox Components
• Tailwind CSS Checkbox Components
• Svelte Checkbox Components
• shadcn/ui Checkbox 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 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
• Animated Color Picker Components