/

Kokonut UI: The Components Worth Taking

A maintained animated registry that is strongest where the others are thin: the AI input surfaces, plus the most-bookmarked background in the catalogue.

Serafim Korablev
Serafim Korablev
@korablev

Kokonut UI is one of the few animated shadcn registries whose components read as designed rather than as effects. Its index carries 40 items, the repository sits at around 2,000 stars, and it shipped as recently as this week, which puts it in the maintained half of the landscape. 56 of its components are published on 21st with a live preview beside each one.

This is what it is actually good at, and where it is not the answer.

The components worth taking

Background Paths is the most-bookmarked background in the entire catalogue: a field of animated SVG paths, no canvas and no frame loop of its own, which makes it unusually cheap for the effect it produces. Beams Background is the light-shaft variant.

Shape Landing Hero is the geometry-over-gradient hero that half the developer-tool landing pages of the last year are descended from. Bento Grid is the feature-grid layout.

The AI-shaped set is the part that is genuinely hard to find elsewhere. AI Voice Input is the recording state with a waveform, v0 AI Chat is the prompt-first chat surface, AI Input With Loading is the composer with its own status message, and Action Search Bar is the search field that suggests actions rather than results.

Hand Writing Text is the SVG signature stroke, and Profile Dropdown and FAQ are the plain product pieces.

What it is not

It is a marketing and AI-surface registry, not a product one. There are no data tables, no date pickers, no settings screens and no form system. For those, shadcn/ui plus a general registry is the answer, and the directory shows which ones carry that kind of surface.

It is also not a design system. The components share a sensibility but not a token set, so mixing four of them into an existing product will need the usual pass over radii, spacing and colour.

Next to its neighbours

Against Aceternity, Kokonut is lighter and less dark-mode-first; against Magic UI, it is smaller but stronger on the AI-input family; against Origin UI, it is the opposite trade, since Origin extends the shadcn primitives and barely changes the look while Kokonut is about the look.

The practical answer is usually not to choose. Take the two or three components that are genuinely better here and leave the rest.

Where else to look

The honest list, because the answer is not always us:

SourceBest forTrade-off
Kokonut UIThe originals with the author's docs and any paid extrasOne registry's worth of components
shadcn/uiThe primitives underneath all of itNo heroes, no backgrounds, no AI surfaces
The registry directoryComparing it against every other tracked registryOnly registries that publish an index
21stThese components with live previews, plus everything nearbyQuality varies by author, so preview before you take it

Taking one

Every component page has a live preview and the code. Installing goes through the shadcn CLI against our registry:

bash

That key comes from your 21st account, and installs require a membership. Set API_KEY_21ST once in your shell and the command works for anything in the catalogue. The 21st MCP covers the same ground without leaving the editor: ask Claude, Cursor or Codex for a component, get the previews inline, and let the agent write the file.

Browse the registry directory →

Frequently asked

Is Kokonut UI maintained?
Yes. Its repository sits at roughly 2,000 stars and shipped within the last week, which puts it in the maintained half of the registry landscape. That matters more than the star count: several larger registries have not shipped since spring.
What is Kokonut UI best at?
Two things. Backgrounds, where Background Paths is the most-bookmarked one in the whole catalogue and renders as animated SVG paths rather than a canvas with its own frame loop. And AI surfaces: voice input with a waveform, a prompt-first chat, a composer with its own status message, and an action-suggesting search bar.
What does Kokonut UI not cover?
Product surfaces. There are no data tables, date pickers, settings screens or a form system, because it is a marketing and AI-surface registry. Pair it with shadcn/ui for primitives and a general registry for the application parts.
Kokonut UI or Aceternity?
Kokonut is lighter and more geometric; Aceternity is darker and heavier on glow, with a larger catalogue. They overlap enough that the useful move is usually not choosing: take the two or three components that are genuinely better in each and leave the rest.

Published

Aug 20, 2026

Read time

4 min

Tags

ComparisonRegistriesReactAI

Share