Comparison
A slider-based component for comparing two items in an overlay.
Installation
npx nopends-ui@latest add comparison
Features
- Compare two items side by side with a draggable slider
- Support for both hover and drag modes
- Smooth animations
- Touch and mouse event support
- Customizable slider appearance
- Responsive design that works with any content
- Context provider for accessing comparison state
Examples
Hover mode
With event handlers
Color Picker
Allows users to select a color. Modeled after the color picker in Figma.
Dialog Stack
Composable stacked dialogs, useful for creating a wizard, nested form or multi-step process. It provides a consistent layout and styling for each dialog, and includes navigation components to move between them.