Change the Hover Styles of Button

What are Hover Styles?

Hover styles refer to the changes that occur when a user moves their mouse pointer over a button. 

These styles can include alterations in color, text, size, or shadows, providing visual feedback and encouraging user interaction.

Customizing hover styles in GemPages is easy and can significantly enhance your page’s user experience.

How to Change the Hover Styles of Button in GemPages

Step 1: Click on the button to open its settings panel on the right side of the editor.

If you don’t already have a button on your page, drag the Button element from the element menu onto your page.

Step 2: In the settings panel, go to the States > Hover

Step 3: Customize the hover styles

You can adjust the following settings:

• Background Color: Choose a color that aligns with your page’s theme and grabs attention.

• Text Color: Select a contrasting or complementary color for better visibility.

• Border: Adjust the thickness, color, and style for a sleek or bold appearance.

• Corner: Set rounded corners for a soft look or sharp edges for a modern feel.

• Shadow: Add a shadow effect to give your button a 3D appearance and make it pop.