Creative Button

The Creative Button module is a Divi button with motion built in. Pick one of eleven hover effects and tune its color, speed, and easing. Every effect also runs on keyboard focus, so nothing is mouse-only.

How to add the Creative Button module

1. Add a section and row, then add the Creative Button module.
2. Enter the button text and link.
3. Choose a hover effect and set its color and speed.

Content

• Button Text and link.
• Hover Effect: None, Fill Up, Fill From Left, Fill Diagonally, Sweep In, Shutter (horizontal), Shutter (vertical), Radial Out, Draw Border, Shine, or Slide Up Text.
• Hover Text: with Slide Up Text, a different label can slide in on hover.
• Alignment (Left, Center, Right) and Full Width.

Design

• Effect Color: the fill, border, or shine color the effect animates with.
• Text Color On Hover so the label stays readable over the fill.
• Effect Speed and Effect Easing, including Smooth and Overshoot curves.
• The standard Divi button options style the resting state.

Tip

Pick one effect and reuse it across the site. A single consistent motion reads as a design decision, while a different effect on every button reads as noise.