Animated Tooltip
A smooth, motion-powered tooltip that brings your UI to life with subtle, elegant animations.
Smooth spring animations4-way positioningCustomizable delays
Basic
Features
Smart Positioning
Automatically adjusts to top, bottom, left, or right placements.
Controlled State
Full control over open/close state via props.
Custom Delays
Configure open and close delays for perfect timing.
Optional Arrow
Toggle the directional arrow for different styles.
Installation
$npx libravelui@latest add animated-tooltipAnatomy
import { AnimatedTooltip } from "@/components/ui/motion/animated-tooltip";<AnimatedTooltip content="Tooltip content"><Button>Hover me</Button></AnimatedTooltip>Testing Playground
Positions
Custom Delay
With Arrow
Props
Loading types…
Animated Switch
A precise switch, engineered with motion physics. Beauty in every pixel. Seamless by default. Use the live controls below to explore controlled/uncontrolled modes, stress tests, and why extra className that alters sizing will break the switch's internal geometry.
Comparator
Interactively compare two elements with a draggable slider to reveal differences.