A direction input shaped like what it controls. Drag a light across a sphere and a sample beside it takes the highlight and drop shadow of that light. Two sliders carry the same two numbers, so the sphere is a convenience and never the only way in.
Files · 11
Dependencies
npm packages
@radix-ui/react-slot
clsx
lucide-react
tailwind-merge
Registry items
https://caliperui.site/r/styles.json
Registry Items
direction-sphere
Configuration
Name
direction-sphere
Type
UI
Description
A direction input shaped like what it controls. Drag a light across a sphere and a sample beside it takes the highlight and drop shadow of that light. Two sliders carry the same two numbers, so the sphere is a convenience and never the only way in.