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 78Backgrounds 18Buttons 9Cards 10Data-display 17Loaders 1Modals 1Navigation 1Text-effects 21

Magic UI components

  • An attributed Word Rotate headline with local compiled CSS, speed, stop and reduced-motion controls. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Word Rotate

    An attributed Word Rotate headline with local compiled CSS, speed, stop and reduced-motion controls.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A headline whose letters act as a window onto a looping video; the preview plays a short local gradient clip instead of a hosted video, with a choice of words and weights. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Video Text

    A headline whose letters act as a window onto a looping video; the preview plays a short local gradient clip instead of a hosted video, with a choice of words and weights.

    Magic UIcompiled-cssdeo-textinteractiveMIT
  • A search hint that types and deletes example queries in a loop with a blinking cursor. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Typing Animation

    A search hint that types and deletes example queries in a loop with a blinking cursor.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A product statement whose words light up one by one as the preview scrolls. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Text Reveal

    A product statement whose words light up one by one as the preview scrolls.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A headline animated word by word or character by character with a chosen entrance preset. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Text Animate

    A headline animated word by word or character by character with a chosen entrance preset.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A headline whose letters flip in 3D on hover, in a locally chosen direction. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Text 3D Flip

    A headline whose letters flip in 3D on hover, in a locally chosen direction.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A circular spinning badge around a logo, with a local spin direction. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Spinning Text

    A circular spinning badge around a logo, with a local spin direction.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A celebration headline with twinkling sparkles in a locally chosen palette. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Sparkles Text

    A celebration headline with twinkling sparkles in a locally chosen palette.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • Two rows of text that drift in opposite directions and speed up as the page scrolls. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Scroll Based Velocity

    Two rows of text that drift in opposite directions and speed up as the page scrolls.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • An attributed Number Ticker with local compiled CSS, count direction, replay and reduced-motion support. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Number Ticker

    An attributed Number Ticker with local compiled CSS, count direction, replay and reduced-motion support.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A headline that morphs between words with a gooey blur effect. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Morphing Text

    A headline that morphs between words with a gooey blur effect.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • A bold headline word with an animated diagonal line shadow in a locally chosen colour. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Line Shadow Text

    A bold headline word with an animated diagonal line shadow in a locally chosen colour.

    Magic UIcompiled-cssinteractiveline-shadow-textMIT
  • A tagline whose letters react with kinetic motion, switching between local phrases. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Kinetic Text

    A tagline whose letters react with kinetic motion, switching between local phrases.

    Magic UIcompiled-cssinteractivekinetic-textMIT
  • A scrambling headline that decodes into place on load and again on hover. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Hyper Text

    A scrambling headline that decodes into place on load and again on hover.

    Magic UIcompiled-csshyper-textinteractiveMIT
  • Hand-drawn highlights, underlines and circles that sketch themselves onto key phrases. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Highlighter

    Hand-drawn highlights, underlines and circles that sketch themselves onto key phrases.

    Magic UIcompiled-cssghlighterinteractiveMIT
  • A headline revealed by a sweeping colour band, replayable. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Dia Text Reveal

    A headline revealed by a sweeping colour band, replayable.

    Magic UIcompiled-cssdia-text-revealinteractiveMIT
  • A comic-book style announcement headline whose size changes locally. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Comic Text

    A comic-book style announcement headline whose size changes locally.

    Magic UIcomic-textcompiled-cssinteractiveMIT
  • Release highlights that fade in from a blur one after another, replayable on demand. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Blur Fade

    Release highlights that fade in from a blur one after another, replayable on demand.

    Magic UIblur-fadecompiled-cssinteractiveMIT
  • A hero headline whose key word shimmers with aurora colours at a locally chosen speed. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Aurora Text

    A hero headline whose key word shimmers with aurora colours at a locally chosen speed.

    Magic UIaurora-textcompiled-cssinteractiveMIT
  • Announcement pill with shimmer width choice, pause and reduced-motion controls. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Animated Shiny Text

    Announcement pill with shimmer width choice, pause and reduced-motion controls.

    Magic UIcompiled-cssinteractivemagic-uiMIT
  • An attributed Animated Gradient Text example with local compiled CSS, accessible controls and reduced-motion support. Magic UI, Text-effects, 0 votes, MIT licence
    text-effects0

    Magic UI Animated Gradient Text

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

    Magic UIcompiled-cssinteractivemagic-uiMIT