Find UI Components

Spectrum UI — Animated React Components & Blocks

Open-source, animation-ready React components and blocks built with Next.js, Tailwind CSS, Motion, TypeScript, and shadcn/ui for SaaS and AI apps.

@spectrumui

Spectrum UI — Animated React Components & Blocks

alert-1

alert-2

alert-3

alert-4

animated-card

animated-SVG-chart

animated-testimonials

autosize-textarea-dependecies

autosize-textarea-demo

autosize-textarea-max-height

autosize-textarea-ref

autosize-textarea-form

autosize-textarea-customize

datetime-picker-demo

datetime-picker-hour-cycle

datetime-picker-and-time-input

datetime-picker-year-range

datetime-picker-locale

datetime-picker-calendar-settings

datetime-picker-display-format

datetime-picker-placeholder

datetime-picker-granularity

datetime-picker-disabled

datetime-picker-ref

datetime-picker-form

dual-range-slider-dependecies

dual-range-slider-demo

dual-range-slider-custom-label

dual-range-slider-label-position

dual-range-slider-single

event-badge-3d

event-calendar

feedback-demo

floating-label-input

floating-label-input-demo

floating-label-customize

floating-label-form

footers-demo

animated-wave-footer

stackedcircular-footer

floatingparticle-footer

footer

http-status-code

image-preview

image-preview

infinite-scroll-dependecies

infinite-scroll-demo

loading-button-dependencies

loading-button-demo

loading-button-usage

loading-button-as-child

multiple-selector-dependencies

inline-code

input-model

multiple-selector-demo

multiple-selector-with-disable-options

multiple-selector-disabled

multiple-selector-no-default-select

multiple-selector-controlled

multiple-selector-hide-clear-all

multiple-selector-creatable

multiple-selector-with-async-search

multiple-selector-with-async-search-and-onfocus

multiple-selector-with-async-search-and-creatable

multiple-selector-with-async-search-and-creatable-and-group

heading-with-anchor

multiple-selector-with-sync-search

multiple-selector-manually-controlled

multiple-selector-with-group

use-toast

multiple-selector-max-selected

multiple-selector-max-text-length

multiple-selector-no-placeholder-when-selected

multiple-selector-fixed-option

multiple-selector-ref

multiple-selector-commandprops

multiple-selector-with-form

multiple-step-form-demo