Revset
Book a Free Audit

30-minute call · No obligation

HomeGHL HubCRM & ContactsHow to Make Your Button Corners Round in GoHighLevel
REVSET LABS · EXPERT GUIDE·CRM & Contacts

How to Make Your Button Corners Round in GoHighLevel

985 words·4 min read·Updated 27 April 2026·beginner·
Arsalan ZaffarArsalan ZaffarLinkedIn

👉 Start your 30-day GoHighLevel free trial.

Start 30-Day Free Trial
Quick Answer

To make button corners round in GoHighLevel, open your page or email builder, select the button element, and adjust the Border Radius setting under its styling options. This takes about 2-3 minutes.

Key Takeaways
  • Always locate the **Border Radius** setting within your button element's styling options.
  • Experiment with both pixel (px) and percentage (%) values to achieve your desired roundness.
  • Adjust each of the four border radius values individually for unique, asymmetrical button designs.
  • Consistently apply your chosen button styling across all pages and emails for a cohesive brand look.
  • Remember to **Save** your changes in the builder and preview your buttons on various devices.

Why Round Buttons Matter for Your Brand

Round buttons are a modern design trend that offers a softer, more approachable look compared to sharp, square edges. This can make your calls-to-action feel less aggressive and more inviting to your audience. Utilizing round corners helps improve the overall user experience and visual appeal of your GoHighLevel pages and emails, leading to better engagement.

How Do I Round Button Corners in the Page Builder?

The GoHighLevel Page Builder gives you full control over your button's appearance. You can easily adjust the border radius to create perfectly round or subtly softened corners. This process ensures your buttons match your brand's aesthetic and contribute to a polished user interface.

1
Access Your PageLog into GoHighLevel and navigate to Sites → Funnels or Sites → Websites. Select the specific funnel or website page you want to edit. Click the Edit icon to open the page builder.
2
Select the Button ElementHover your mouse over the button you wish to modify. A green border will appear around it. Click on the button to select it, which will display its settings panel on the left side of your screen.
3
Open Button Styling OptionsIn the left-hand settings panel, ensure you are on the Settings tab. Scroll down or click on the Advanced styling options if they are collapsed. You are looking for design-related properties, specifically border settings.
4
Locate Border RadiusWithin the styling options, find the section labeled Border. Inside this section, you will see the Radius setting. This directly controls the curvature of your button's corners.
5
Adjust the Radius ValuesEnter a numerical value into the Radius field. You can use pixel values (e.g., "10px", "20px") for specific curvature or percentages (e.g., "50%") for fully rounded "pill" shapes. A higher value creates a more pronounced curve.
6
Link or Unlink CornersBy default, all four corners might be linked, meaning one value applies to all. If you want different corner radii (e.g., rounded top, square bottom), click the Chain icon next to the radius field to unlink them. This allows you to set individual values for top-left, top-right, bottom-right, and bottom-left corners.
7
Save Your ChangesAfter adjusting the radius to your liking, click the green Save button in the top right corner of the page builder. This action applies your design changes to the live page. Always preview your page to ensure the button appears as intended.

⚠️ Always preview your page on both desktop and mobile devices after making design changes. Button radius can sometimes impact how text fits inside the button on smaller screens, potentially requiring padding adjustments.

🔥 Pro Tip

For a perfectly pill-shaped button, set the Radius to 50% if your button has roughly equal height and width, or a high pixel value that matches half of the button's height. This creates a smooth, continuous curve.

Try GoHighLevel Free

Start your 30-day GoHighLevel free trial

Everything in this guide is in your free trial. 30 days, no credit card — the platform behind 78+ revenue systems.

Start 30-Day Free Trial

Some links are affiliate links — if you sign up we may earn a commission, at no extra cost to you. We only recommend GoHighLevel because we build on it every day.

How Do I Round Button Corners in the Email Builder?

Just like in the Page Builder, the Email Builder allows you to customize the look of your call-to-action buttons. Rounding corners here helps create visually appealing and clickable emails that stand out in your recipients' inboxes. The process is very similar, ensuring consistency across your marketing efforts.

1
Access Your Email TemplateNavigate to Marketing → Emails → Templates or Marketing → Emails → Campaigns. Select the email template or campaign you wish to edit. Click the Edit icon to open the email builder.
2
Select the Button ElementIn the email design canvas, click directly on the button you want to modify. Its specific settings panel will open on the right side of the builder.
3
Find Button PropertiesIn the right-hand settings panel, scroll down to locate the Button Properties or Style section. These options control the visual appearance of your button.
4
Locate Border RadiusWithin the styling options, you will find the Border Radius setting. This directly controls how curved the corners of your button will be.
5
Adjust the Radius ValuesEnter your desired numerical value for the radius. Use pixel values (e.g., "5px", "15px") for subtle rounding or higher values for more significant curves. Percentage values (e.g., "50%") are also an option for a fully rounded look.
6
Apply to All Corners (or Individually)The email builder often links all four corners by default. Adjusting one value will update all. If you need individual corner control, look for an Unlink or Advanced Border option, though this is less common in the email builder compared to the page builder. Set the desired value to achieve uniform roundness.
7
Save Your Email TemplateOnce you are satisfied with the button's appearance, click the Save Template button (or Save if editing a campaign email) in the top right corner. This saves your design changes to the email.

✅ Always send a test email to yourself and preview it on different email clients (Gmail, Outlook, Apple Mail) and devices (desktop, mobile). Email rendering can vary, and testing ensures your rounded buttons display correctly for all recipients.

Troubleshooting Common Issues

⚠️ Button corners are not changing after I enter a value.
Ensure you have selected the correct button element. Also, verify that the Radius field is accepting the input and you are clicking Save in the builder. Sometimes, clearing your browser cache can also help.
⚠️ Only one corner of my button is rounding, not all four.
In the Page Builder, check for a Chain icon next to the Radius field. If it's unlinked, click it to link all four corners so one value applies universally. Alternatively, manually set values for all four individual corners.
⚠️ My button text looks squished or cut off after rounding the corners.
This often happens if the radius is too high for the button's current padding or size. Increase the Padding (internal space) of the button, or slightly reduce the Radius value. You might also need to adjust the button's overall width.
⚠️ My changes disappear when I leave the builder without clicking save.
Always click the green Save button in the top right corner of both the Page Builder and Email Builder after making any design modifications. Unsaved changes will be lost.
⚠️ I can't find the 'Border Radius' option for my button.
Make sure you have clicked directly on the button element itself. The settings panel on the left (Page Builder) or right (Email Builder) only displays relevant options for the selected element. If still missing, check under an Advanced or Style section within the button settings.

Common Mistakes to Avoid

  • Forgetting to click the Save button in the builder, causing all design changes to be lost.
  • Applying inconsistent border radii across different buttons on the same page or throughout a funnel, leading to a disjointed user experience.
  • Setting an excessively high border radius on very small buttons, which can make the button look like a circle or an oval and obscure the text.
  • Neglecting to test button appearance on mobile devices, where high border radii or small text can create readability issues.
  • Failing to adjust button padding when changing the border radius, which can lead to text being too close to the rounded edges or cut off.

Frequently Asked Questions

QWhat is 'Border Radius' in GoHighLevel?
Border Radius is a CSS property that allows you to round the corners of an element, like a button. In GoHighLevel, you adjust this setting within the button's styling options in the page or email builder. A value of 0px creates square corners, while higher pixel values or a percentage like 50% create increasingly rounded shapes, up to a full circle or 'pill' shape.
QCan I make only specific corners of a button round?
Yes, in the GoHighLevel Page Builder, you can make specific corners round. When you locate the **Radius** setting, look for a **Chain** icon next to the input field. Clicking this icon will unlink the corners, allowing you to enter different values for the top-left, top-right, bottom-right, and bottom-left corners independently. This feature enables highly customized button designs.
QDoes rounding button corners affect mobile responsiveness?
Rounding button corners generally does not negatively affect mobile responsiveness, as long as you use appropriate values. However, very high border radii combined with small button sizes or large text can sometimes lead to text wrapping or being cut off on smaller screens. Always preview your pages and emails on mobile devices to ensure optimal display and readability after making design changes.
QWhat's the difference between using 'px' and '%' for border radius?
When setting border radius, 'px' (pixels) provides a fixed, absolute curve value, regardless of the button's size. For example, '10px' will always be a 10-pixel radius. '%' (percentage) creates a curve relative to the button's dimensions. For instance, '50%' on a square button will make it a circle, while on a rectangular button, it creates a 'pill' shape by rounding half of the button's height. Use 'px' for consistent subtle curves and '%' for fully rounded, dynamic shapes.
QWhere exactly do I find the 'Border Radius' setting in GoHighLevel?
In the GoHighLevel Page Builder, after selecting your button element, you'll find the **Radius** setting under the **Border** section within the left-hand settings panel. In the Email Builder, after selecting a button, look for **Border Radius** within the **Button Properties** or **Style** section in the right-hand settings panel. Always ensure the button element is actively selected for these options to appear.
Try GoHighLevel Free

Start your 30-day GoHighLevel free trial

Everything in this guide is in your free trial. 30 days, no credit card — the platform behind 78+ revenue systems.

Start 30-Day Free Trial

Some links are affiliate links — if you sign up we may earn a commission, at no extra cost to you. We only recommend GoHighLevel because we build on it every day.

Arsalan Zaffar
Arsalan Zaffar
Revset Labs · Revenue Systems · 78+ GHL Builds

Arsalan writes GHL guides from real build experience — 78+ systems, $9.2M in client pipeline. Wharton, CXL & Google certified.

Connect on LinkedIn
Tags:GoHighLevelButton StylingPage BuilderEmail BuilderDesign TipsUI/UX