---
title: Button
description: "The Button widget allows you to add fully customizable call-to-action buttons to your design. You can easily change the text, link, alignment, icons, size, and styling to match your layout perfectly. ## How to Use Button Widget of Easy Elements…"
url: "https://wpeasyelements.com/docs/button/"
updated: "2025-11-17"
category: General Widgets
---

# Button

The Button widget allows you to add fully customizable call-to-action buttons to your design. You can easily change the text, link, alignment, icons, size, and styling to match your layout perfectly.

## How to Use Button Widget of Easy Elements

#### Step to Add Button Widget:[https://happyaddons.com/docs/happy-addons-for-elementor-pro/happy-effects-pro/advanced-heading/#step-1](https://happyaddons.com/docs/happy-addons-for-elementor-pro/happy-effects-pro/advanced-heading/#step-1)

Select the Button widget from the left panel, then drag and drop it into your desired area on the canvas.

![](https://wpeasyelements.com/wp-content/uploads/2025/10/image-6.png)

#### Button Features & Settings:

Configure every aspect of your button widget including button types, icon settings, button gradient bg and border and more settings.

1. **Button Text**
2. ****Button Url****
3. ****Button Type****
4. ****Button Icon****
5. **Icon Spacing**
6. **Icon Position**
7. **Button Min Width**
8. **Button Alignment**
9. **Default Gradient BG**
10. **Gradient Border Color**

![](https://wpeasyelements.com/wp-content/uploads/2025/10/image-7.png)

#### Customize Button Style:

Easily customize your widget’s appearance including size, color, background, spacing, and more—all from the Style panel.

1. **Button Size, Color, Background, Gradient Background etc.**
2. ****Button Hover Color, Background, Gradient Background etc.****
3. ****Button**Icon Normal Style**
4. ****Button Icon Hover Style****

![](https://wpeasyelements.com/wp-content/uploads/2025/10/image-8.png)

#### Watch this video with all settings changes and previews.

**Video Coming Soon**