Super Button
Make your main buttons stand out so more people click them.
Call-to-action buttons with an icon box and twelve styles (Morphy, Hide & Seek, Back & Forth, Pill, Pipeline, Resurface, roll, glare, gradient border, neon, 3D press, liquid), sub text, badges, attention seekers, ripple and magnetic pull.
Elementor widget
Requirements
- Elementor 3.5 or newer
- WordPress 6.2 or newer
- PHP 7.4 or newer
- Licence: Pro ($2 / year) — add it to the cart in Moduly
Add it to a page
- Edit the page with Elementor.
- In the widget panel, search for Super Button. Our widgets sit in the Moduly category and carry the Moduly badge.
- Drag it onto the page.
- Set it up in the Content tab, style it in the Style tab, and use Advanced for spacing, motion and visibility.
Settings
Button
| Setting | What you can set |
|---|---|
| Style | Pick one |
| Colour Preset | Indigo, Ink, Light, Coral, Emerald, Sunset gradient or Outline |
| Text | Text |
| Sub Text | Text |
| Sub Text Position | Below the text or Above the text (store badge style) |
| Link | Link |
| Icon | Icon picker |
| Hover Icon | Optional second icon that takes over on hover. |
| Icon Side | Left or Right |
| Badge | Text |
| Size | Extra small, Small, Medium, Large or Extra large |
| Alignment | Left, Center, Right or Full width |
| Button ID | For analytics or anchors. Letters, numbers, dashes. |
Attention & Interaction
| Setting | What you can set |
|---|---|
| Attention Seeker | None, Pulse ring, Heartbeat, Shake, Bounce, Wobble or Shine · A small repeating motion that draws the eye while the button waits. Stops on hover. |
| Repeat Every (s) | 1–10 |
| Ripple on Click | On / off |
| Magnetic Pull | The button leans toward the pointer. Off on touch screens, for reduced motion and in the editor. |
| Strength (%) | 5–80 |
| Reach (px) | 0–80 |
| Hover Speed (ms) | 100–1500 |
Style tab: design controls for Button, Icon Box or Sub Text & Badge — colours, typography, spacing, borders and hover states.
Tips
- Visitors who ask their device for reduced motion get a calmer, still version automatically.
Troubleshooting
- Neon is designed for dark sections; on white it reads as an outline button.
- Changes not showing on the live page? Regenerate CSS in Elementor → Tools → Regenerate CSS & Data and clear any page cache.
Related
- Works well with: Creative Button, Modal Popup.