Webflow
Webflow is a no-code website builder with powerful CMS and design customization.
Website
Industry
Website
Share this article:

How to create an ellipse-shaped border in Webflow

Here is how to create an ellipse-shaped border in webflow

  1. First, select the element to which you want to add a border
  2. Click on the "Style" tab in the right sidebar settings panel
  3. In the right sidebar, click on the "Borders" section to expand it
  4. Click on the "PX" unit selector in the Borders settings
  5. Select the "%" unit from the dropdown menu
  6. Finally set the border radius value to "50" using the number input field

Create your own interactive guide with Guideflow

Why should you create an ellipse-shaped border in Webflow

Webflow is an intuitive platform that empowers users to craft stunning websites without the need for coding.

Creating an ellipse-shaped border in Webflow adds a touch of elegance and creativity to your designs, making them stand out with minimal effort.

This simple feature allows for enhanced visual storytelling, contributing to a memorable user experience by breaking away from conventional rectangular boundaries.

By employing this feature, you can guide visitors’ focus and elevate the aesthetic appeal of your site, all while maintaining design consistency.

Last update
March 2, 2026
Cursor MariaA cursor points to a button labeled "James."

Create your first demo in less than 30 seconds.