All Collections
Designer Tools
Edit Buttons and Forms Using the UI Kit
Edit Buttons and Forms Using the UI Kit

How to Edit Buttons and Fields on Your SpringBuilder Website

Karen Sahakyan avatar
Written by Karen Sahakyan
Updated over a week ago

Button and field styles may not be on your list of priorities, but we promise you it should be. Success for your site means stylish pages, right down to the buttons and fields.

SpringBuilder has a handy UI Kit where you can easily manage the Buttons and Fields for your website. Head to Dashboard > Designer Tools app to get started. You can create a new button by simply hitting the New Button option.

To get started, select a button and choose the Font Family from the dropdown menu. You can then move the pointers to change the Font Size, Weight, and Letter Spacing.

You can also adjust the Border Radius and Width by clicking on the borders and moving the pointers accordingly. If the lock symbol displays that it's open, you can adjust each corner separately. If the lock symbols displays that it's locked, then all corners will be adjusted simultaneously.

You'll also find options to set the Height, Width, and Padding of the button using the Sizes Arrow pointers respectively.

!Note: Keep in mind that the lock symbol is also used while adjusting the Height, Width, and Padding of the button.

Use the Colors Tool to change the Background, Border, and Text Colors.

Just select your desired option and choose the color shades and opacity level from the Color Palette.

Same with the Hover Colors, cool right? Check it out in action:

Be it a Play now or Claim Bonus, here are some bonus tips you should consider to cross "Create powerful CTAs" off your to-do list!

  • The text on the Buttons should be short and simple while directing the user to act.

  • Make sure to leave some text around the Buttons to visually emphasize it.

  • When selecting the color, make sure that it stands out from the page's color theme and is vivid enough to be noticed, but still compliments the overall website color scheme. 

Use the UI Kit to customize all of the Forms' fields. This allows you to match the buttons in design and color to complete your website's overall look.

Customize the Label and Text Font Size, Borders, and Paddings for both the Form and Subscription elements according to your needs. Just use your controllers to make the adjustments. The changes made will affect the whole website.

Customize field Margins, Height, Color, and Alignment. They'll be applied on all the Buttons and Fields of your website.

Create powerful CTAs, polished form fields, and an intuitive, sleek website design using the SpringBuilder UI Kit.

Related Articles

For any further questions or concerns you may have, please visit the SpringBuilder Help Center for more information. 

Did this answer your question?