KokonutUI Logo

Changelog

New and updated Kokonut UI components, release by release, with a link to each component and its pull request.

October 14, 2026

New components16

  • CD-08Notification StackCardsStacked notifications that fan out on hover and swipe away, built with React and Tailwind CSS.#39
  • IN-05Detent DialInputsRotary knob that clicks from notch to notch and coasts when flicked, built with React and Motion.#40
  • IN-06Wheel PickerInputsiOS-style 3D drum picker with flick momentum, built with React and Motion.#41
  • BG-05Topo BackgroundBackgroundsA living contour map that drifts, rises under the cursor and ripples on click, built with React and Canvas.#46
  • BT-10Pull CordButtonsA lamp switch you pull on a swinging cord, built with React and a rope simulation.#47
  • CD-09Liquid GaugeCardsA usage meter filled with liquid that sloshes, ripples and bubbles, built with React and a wave simulation.#50
  • CD-10Activity TerrainCardsA contribution heatmap that tilts up into a 3D terrain you can turn, built with React and canvas.#51
  • CD-11Receipt PrinterCardsA receipt that prints line by line, then tears off and falls when you pull it, built with React.#52
  • IN-07Liquid SliderInputsA vertical slider you fill like a glass, with a sloshing surface and rising bubbles.#53
  • IN-08Signature PadInputsA signature field with a sprung pen tip, speed-weighted ink and SVG output.#54
  • BT-11Tear ButtonButtonsA confirm button you tear off like a ticket stub, hole by hole.#55
  • BT-12Bell ButtonButtonsA subscribe button whose bell swings and rings, with a clapper that really strikes.#56
  • TX-05Plucked TextTextsA headline sitting on a string you can pluck, strum and let ring, built with React and real string physics.#57
  • NV-07Marking MenuNavigationA radial menu you hold to open or flick to pick blind, built with React and Motion.#58
  • BG-06Drape BackgroundBackgroundsA pleated curtain in a breeze that you can push and pull, built with React, WebGL and a cloth simulation.#59
  • BG-01Dot FieldBackgroundsA halftone dot membrane that ripples behind a swipe and rings out from a click, built with React and Canvas.#67

Improved28

  • CD-01Flick CardCardsRebuilt as Flick Card: drag or flick it to spin, with thickness and light that follow the angle.#67
  • CD-02Throw DeckCardsRebuilt as Throw Deck: throw the top card off and it tucks back under the pile.#67
  • CD-07Momentum RailCardsRebuilt as Momentum Rail: drag with momentum and cover-flow depth from scroll.#67
  • CD-03Now PlayingCardsRebuilt as Now Playing: a spinning disc you turn to scrub the track.#67
  • CD-05Widget GridCardsRebuilt as Widget Grid: pick up, reorder and resize widgets by pointer or keyboard.#67
  • TX-02Dynamic TextTextsRebuilt as Morph Text: letters travel, fall and land between strings, with decode and cycle modes.#67
  • TX-03Glitch TextTextsRebuilt as Signal Text: flat text with sliced band glitches, on idle, hover or change.#67
  • TX-04Extruded TextTextsRebuilt as Extruded Text: 3D letters lit by the cursor that sink like keycaps.#67
  • BG-04WindBackgroundsRebuilt as Wind: monochrome streamlines that part around the cursor and swirl in its wake.#67
  • NV-02Tool DockNavigationRebuilt as Tool Dock: a draggable editor dock with tooltips, shortcuts and tool flyouts.#67
  • NV-03Swipe TabsNavigationRebuilt as Swipe Tabs: swipe the panel and the indicator follows your finger.#67
  • NV-01Split NavNavigationRebuilt as Split Nav: the bar splits around the active link and you can scrub across it.#67
  • NV-04Account MenuNavigationRebuilt as Account Menu: the card morphs into its menu, with account switching and hold to sign out.#67
  • NV-05Command PaletteNavigationRebuilt as Command Palette: nested pages, fuzzy matching and instant keyboard use.#67
  • IN-02Avatar PickerInputsFaces generated from your name, on a 3D coin you can flick or shuffle.#67
  • CD-06Currency TransferCardsOdometer amounts, a chip that carries the money across, and a progress arc.#67
  • TX-01Typing TextTextsA caret that blinks only when idle, select-to-delete, and optional typos.#67
  • CD-04Apple Activity CardCardsNumbers count up with the rings, and rings can go past 100%.#67
  • CD-08Notification StackCardsReleased cards spring back or fly away with your finger's speed.#67
  • BG-05Topo BackgroundBackgroundsElevation labels on the contour lines.#67
  • BG-02Background PathsBackgroundsRebuilt as one flowing ribbon of lines that part around the cursor.#48
  • BG-03Shape HeroBackgroundsRebuilt around a pile of shapes you can drag and throw.#49
  • AI-05AI VoiceAIA scrolling waveform, and a take you review before sending.#60
  • AI-01AI Input SelectorAIAttachment chips, slash commands, and Stop while it replies.#61
  • AI-03AI State LoadingAIAgent steps with a live log, a step rail and timings.#62
  • AI-04AI Text LoadingAIA letter wave instead of a gradient shimmer.#63
  • BT-01Particle ButtonButtonsCalls your onClick and onSuccess, and keeps particles inside the button.#25
  • BT-03Gradient ButtonButtonsCorrect light and dark themes, and renders its children and icon.#27

Across the library

  • Every component now works right after shadcn add, without the docs site's styles.#32
  • Fixed components whose main feature didn't work.#33
  • Keyboard, focus and screen reader fixes, and reduced motion support, across the library.#34#35#36

On this page