# Button Designing

## Button Design Basics

{% hint style="info" %}
This method works with all buttons and sections or blocks.
{% endhint %}

{% embed url="<https://www.youtube.com/watch?v=5cf5iNuk2lw>" %}

####

#### Click on a button and then click on power (design icon) to open the button design settings.

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-L_XFr2HsZ_Lc942qlPD%2F-L_XFyFI3nV5yCST0UW5%2Fbutton-design-vintcer-website%20builder.png?alt=media\&token=f28e725e-ec8d-4c05-9bdf-fb1a4c40e060)

#### After Clicking on Button Style a Button Style Manager window will appear.&#x20;

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-L_XFr2HsZ_Lc942qlPD%2F-L_XGLfidgaJJT07LQXT%2Fbutton-settings-vintcer-website-builder.png?alt=media\&token=27703ce0-f535-41e3-9f0f-6929d738e017)

From Button effects you can choose type of effects/Animation like-&#x20;

Clear, Color Stretch, jump, Underline, Color Slide, Color Fade, Grow, Shadow etc.

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-LBzK8L7fCemyUhWmsm4%2F-LBzNvdQf9TL3EO9AInS%2FScreenshot%202018-05-08%2016.24.39.png?alt=media\&token=7e54509a-54e8-4eba-b1ac-4eac1ac11992)

You can change border color, border Width and radius and Hover Color etc.&#x20;

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-LBzP8_roNQIT0pI9BCQ%2F-LBzPNDGgx3KQ1K3LdMX%2FScreenshot%202018-05-08%2016.31.00.png?alt=media\&token=a109f9a4-6a20-46e6-84a0-505d466ddae6)

## Pro settings for Buttons

{% hint style="warning" %}
Pro settings are only available to Paid users. You can purchase a premium license from here- <https://www.vintcer.com/pricing>
{% endhint %}

Click anywhere in a Block and then select Section setting

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-L_XFr2HsZ_Lc942qlPD%2F-L_XGjLksb5xGEt9RVVw%2FSection-settings-website-button-vintcer-website-builder.png?alt=media\&token=2c169a5f-08c6-46bb-8217-cf708ca789d0)

Choose Pro option from the setting option and then choose button spacing (Under spacing control) and modify the settings as per your requirements.&#x20;

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-LBzP8_roNQIT0pI9BCQ%2F-LBzTAIG3IPlsBBKy8D1%2FScreenshot%202018-05-08%2016.39.45.png?alt=media\&token=a12e18c3-236b-4c1d-8c72-7d5b0b55085f)

You can now adjust the dimensions for buttons.

![](https://2358477259-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LBo_mo13rwfUpGj8X6-%2F-LBzP8_roNQIT0pI9BCQ%2F-LBzTK0kzHTFWr91N5OH%2FScreenshot%202018-05-08%2016.39.53.png?alt=media\&token=bb501e14-72a2-445c-8eb6-e0daf1ca7462)