Skip to main content
kaino.dev

Components, tools, and news for developers.

Explore

LibraryNews

Community

TwitterYouTubeInstagram

© 2026 Kaino.dev

Privacy PolicyTerms of Service

v0.1.0

kaino.dev
LibraryDiscoverNews
LibraryDiscoverNews
Theme
Library/Components

Components

Ready-to-use components curated and voted on by the community.

KainoKaino ComponentsExternalExternal Libraries

Browse by library

Library directory
All librariesAnimate UIAnt DesignArk UIBase UIChakra UIdaisyUIFlowbite ReactHeadless UIHeroUIMagic UIMantineMaterial UIMotion PrimitivesRadix PrimitivesReact AriaReact BitsReact-Bootstrapshadcn/ui

Categories

All 33Buttons 1Cards 5Data-display 6Feedback 1Modals 2Navigation 7Text-effects 11

Motion Primitives components

  • A thinking indicator whose letters ripple in a shimmering wave. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Shimmer Wave

    A thinking indicator whose letters ripple in a shimmering wave.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A loading message with a shimmering highlight sweeping across it at a local speed. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Shimmer

    A loading message with a shimmering highlight sweeping across it at a local speed.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • An attributed Text Scramble example with message switching, replay, screen-reader text and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Scramble

    An attributed Text Scramble example with message switching, replay, screen-reader text and reduced-motion support.

    Motion Primitivesanimationinteractivemotion-primitivesMIT
  • A headline whose letters roll into place, replayable with a new word. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Roll

    A headline whose letters roll into place, replayable with a new word.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A follow button whose label morphs letter by letter between states. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Morph

    A follow button whose label morphs letter by letter between states.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • An attributed Text Loop example with local compiled CSS, accessible controls and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Loop

    An attributed Text Loop example with local compiled CSS, accessible controls and reduced-motion support.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • An attributed Text Effect example with local compiled CSS, accessible controls and reduced-motion support. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Text Effect

    An attributed Text Effect example with local compiled CSS, accessible controls and reduced-motion support.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A rotating circular label around an open-for-hire badge, with a local speed. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Spinning Text

    A rotating circular label around an open-for-hire badge, with a local speed.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A countdown timer whose digits slide vertically as each second ticks. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Sliding Number

    A countdown timer whose digits slide vertically as each second ticks.

    Motion Primitivescompiled-cssinteractiveitives-sliding-numberMIT
  • An attributed Motion Primitives Animated Number example with local CSS, accessible controls and announced state. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives Animated Number

    An attributed Motion Primitives Animated Number example with local CSS, accessible controls and announced state.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • Story sections that animate in as they scroll into view inside a reading panel. Motion Primitives, Text-effects, 0 votes, MIT licence
    text-effects0

    Motion Primitives In View

    Story sections that animate in as they scroll into view inside a reading panel.

    Motion Primitivescompiled-cssin-viewinteractiveMIT
  • An attributed Transition Panel example with local compiled CSS, accessible controls and reduced-motion support. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Transition Panel

    An attributed Transition Panel example with local compiled CSS, accessible controls and reduced-motion support.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A compact toolbar whose buttons expand into panels of matching content, measured and animated in place. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Toolbar Expandable

    A compact toolbar whose buttons expand into panels of matching content, measured and animated in place.

    Motion Primitivescompiled-cssinteractiveitives-toolbar-expandableMIT
  • A compact notes toolbar whose search button expands it into a search field. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Toolbar Dynamic

    A compact notes toolbar whose search button expands it into a search field.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • A macOS-style app dock whose icons magnify under the pointer and open apps locally. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Dock

    A macOS-style app dock whose icons magnify under the pointer and open apps locally.

    Motion Primitivescompiled-cssdockinteractiveMIT
  • A shipping details disclosure that expands and collapses with a spring animation. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Disclosure

    A shipping details disclosure that expands and collapses with a spring animation.

    Motion Primitivescompiled-cssdisclosureinteractiveMIT
  • An attributed Animated Background segmented control with local compiled CSS, pressed-state buttons and reduced-motion support. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Animated Background

    An attributed Animated Background segmented control with local compiled CSS, pressed-state buttons and reduced-motion support.

    Motion Primitivescompiled-cssinteractivemotion-primitivesMIT
  • An animated FAQ accordion where one answer opens at a time with a smooth height transition. Motion Primitives, Navigation, 0 votes, MIT licence
    navigation0

    Motion Primitives Accordion

    An animated FAQ accordion where one answer opens at a time with a smooth height transition.

    Motion Primitivesaccordioncompiled-cssinteractiveMIT
  • An attributed Morphing Dialog that expands a release card into a modal with focus trapping, focus return, Escape and outside-click closing and reduced-motion support. Motion Primitives, Modals, 0 votes, MIT licence
    modals0

    Motion Primitives Morphing Dialog

    An attributed Morphing Dialog that expands a release card into a modal with focus trapping, focus return, Escape and outside-click closing and reduced-motion support.

    Motion Primitivesanimationinteractivemotion-primitivesMIT
  • A native dialog that scales in over a blurred backdrop to confirm inviting a teammate. Motion Primitives, Modals, 0 votes, MIT licence
    modals0

    Motion Primitives Dialog

    A native dialog that scales in over a blurred backdrop to confirm inviting a teammate.

    Motion Primitivescompiled-cssdialoginteractiveMIT
  • An add-note button that morphs into a small note form and back. Motion Primitives, Feedback, 0 votes, MIT licence
    feedback0

    Motion Primitives Morphing Popover

    An add-note button that morphs into a small note form and back.

    Motion Primitivescompiled-cssfeedbackinteractiveMIT
  • A spring-smoothed reading progress bar tied to a local article container. Motion Primitives, Data-display, 0 votes, MIT licence
    data-display0

    Motion Primitives Scroll Progress

    A spring-smoothed reading progress bar tied to a local article container.

    Motion Primitivescompiled-cssdata-displayinteractiveMIT
  • A looping logo strip that slows down on hover, in horizontal and reversed directions. Motion Primitives, Data-display, 0 votes, MIT licence
    data-display0

    Motion Primitives Infinite Slider

    A looping logo strip that slows down on hover, in horizontal and reversed directions.

    Motion Primitivescompiled-cssdata-displayinteractiveMIT
  • An attributed before/after Image Comparison with local compiled CSS, drag control and an added keyboard-accessible range input. Motion Primitives, Data-display, 0 votes, MIT licence
    data-display0

    Motion Primitives Image Comparison

    An attributed before/after Image Comparison with local compiled CSS, drag control and an added keyboard-accessible range input.

    Motion Primitivesimage-comparisoninteractivemotion-primitivesMIT

Page 1 of 2

Next