Change an element's border

Add or edit borders and shadows in the visual editor.

Borders can help highlight content, create separation, or add design consistency across your site. You can modify existing borders — like those on buttons — or apply new styles, colors, and shadows to any element.

Change an element's border

In the visual editor:

1. Select an element
2. Go to Borders in the Changes panel
3. Modify the style options, add a border color, and/or apply a drop shadow

Border style options

The default unit is pixels, but you can click px to choose a different unit type (e.g., % or em).

• Style — choose from solid, dashed, dotted, and other visual styles
• Width — change the thickness of the border
• Radius — choose square corners (i.e., 0 px) or rounded corners (e.g., 6 px)

Border color options

You can apply a background color using:

• Color value — click the Color field, then enter an RGB, CMYK, or HEX value
• Color picker — click the color square, then choose a color or click the Eyedropper to sample one from the page

Shadow options

You can enter box shadow values in the Shadow field to apply a drop shadow. Learn how to apply shadows.