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

  • A terminal that types an install command and reveals its output line by line, replayable. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Terminal

    A terminal that types an install command and reveals its output line by line, replayable.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A spring-smoothed arrow cursor that tilts in the direction of travel across the preview. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Smooth Cursor

    A spring-smoothed arrow cursor that tilts in the direction of travel across the preview.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A gradient reading-progress bar pinned to the top of a long article as the preview scrolls. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Scroll Progress

    A gradient reading-progress bar pinned to the top of a long article as the preview scrolls.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A Safari browser mockup framing a local landing page, with an editable address. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Safari

    A Safari browser mockup framing a local landing page, with an editable address.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A changelog panel whose top and bottom edges fade out under a progressive blur while scrolling. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Progressive Blur

    A changelog panel whose top and bottom edges fade out under a progressive blur while scrolling.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A custom animated pointer that replaces the cursor inside a pricing card. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Pointer

    A custom animated pointer that replaces the cursor inside a pricing card.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A product photo revealed tile by tile as pixels fade in, then fading from grayscale to colour. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Pixel Image

    A product photo revealed tile by tile as pixels fade in, then fading from grayscale to colour.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • Two concentric orbits of app icons circling a central hub in opposite directions, with a pause control. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Orbiting Circles

    Two concentric orbits of app icons circling a central hub in opposite directions, with a pause control.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A magnifying lens that follows the pointer over a product photo, with a chosen zoom level. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Lens

    A magnifying lens that follows the pointer over a product photo, with a chosen zoom level.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • An iPhone mockup framing a local app screen that switches between two views. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI iPhone

    An iPhone mockup framing a local app screen that switches between two views.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A draggable 3D sphere of tool icons that spins on its own and pauses on demand. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Icon Cloud

    A draggable 3D sphere of tool icons that spins on its own and pauses on demand.

    Magic UIcompiled-cssdata-displayicon-cloudMIT
  • An expandable project file tree with folders, files and a selected file. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI File Tree

    An expandable project file tree with folders, files and a selected file.

    Magic UIcompiled-cssdata-displayinteractiveMIT
  • A before-and-after code view highlighted by shiki, with the changed lines marked. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Code Comparison

    A before-and-after code view highlighted by shiki, with the changed lines marked.

    Magic UIcompiled-cssdata-displayde-comparisonMIT
  • Overlapping contributor avatars with a count of other people, from local avatar data. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Avatar Circles

    Overlapping contributor avatars with a count of other people, from local avatar data.

    Magic UIavatar-circlescompiled-cssdata-displayMIT
  • Activity notifications that slide in one by one with the animated list, replayable on demand. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Animated List

    Activity notifications that slide in one by one with the animated list, replayable on demand.

    Magic UIanimated-listcompiled-cssdata-displayMIT
  • Animated beams connect a web app, an API and a database to show a request flowing between services. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Animated Beam

    Animated beams connect a web app, an API and a database to show a request flowing between services.

    Magic UIanimated-beamcompiled-cssdata-displayMIT
  • An Android phone mockup framing a local app screen that switches between light and dark. Magic UI, Data-display, 0 votes, MIT licence
    data-display0

    Magic UI Android

    An Android phone mockup framing a local app screen that switches between light and dark.

    Magic UIandroidcompiled-cssdata-displayMIT