design-infraReport a problem or share feedback← Catalog
Dot Morph Button
curatedfreesmoothui/dot-morph-button
A DotMorphButton component for SmoothUI.
$
npx shadcn@latest add @smoothui/dot-morph-buttonnpm deps: motion
Our notes
Small tactile hover feedback on a real button. Use a clear action label and actual click feedback; keep the dot decorative and preserve reduced-motion behavior. Hosted demo uses the upstream SmoothButton dependency locally.- Source
- SmoothUI
- Kind
- component
- Categories
- button
- Use as
- drop-in — replaces your component
- Applies to
- button
- Motion
- on state, hover · medium · motion · medium cost · respects reduced motion
- Tags
- button, dot, morph, hover, spring, complexity-low, reduced-motion
- Licence
- MIT ("MIT License — Copyright (c) 2024 Eduardo Calvo", github.com/educlopez/smoothui).
- Live demo
- Interactive preview
- Docs
- smoothui.dev
Similar
Compare all 4 →- Button Stateful Buttonbeui/button-statefulUseful for save/submit flows with loading, success and error states. Wire real async outcomes; keep labels and error handling explicit.
- Texture Buttoncult-ui/texture-buttonSkeuomorphic textured button variants. Heavy hard-coded neutral/indigo gradients — fits soft-glass/editorial looks, clashes with flat themes.
- Interactive Hover Buttonmagicui/interactive-hover-buttonPill button whose label slides out for an arrow + primary fill on hover. Uses bg-primary/text-primary-foreground — one of the few fully token-based Magic UI pieces.