Border & Radius Settings

Border and Border Radius are visual styling options available on select blocks. They allow you to add outlines and rounded corners to elements, helping create emphasis, separation, or a softer visual appearance.


When to use Border and Radius

Use these settings to enhance visual clarity and hierarchy.

Common use cases include:

  • Emphasizing images, quotes, or featured content
  • Creating softer, more approachable designs with rounded corners
  • Reinforcing visual consistency across similar elements

Use these settings intentionally. Borders and corner styles are part of the overall design system and work best when applied consistently.


Where to find the settings

These are not standalone blocks. These settings appear in the block settings sidebar when a supported block is selected.

  • Open the Styles tab in the right sidebar
  • Scroll to the Border section

Not all blocks include these settings. Availability depends on the block and the design system used on your site. Typically, these are available on Image, Cover and Pullquote blocks.


How to configure

Border

Controls the outline around a block.

  • Border color: Select a color for the border
  • Border width: Set the thickness (typically in px or em)
  • Apply to all sides: By default, the border is applied to all four sides

You can also control each side individually:

  • Click the unlink icon to adjust top, right, bottom, and left borders independently
  • This is useful for adding borders to specific sides, such as top and bottom only

Border Radius

Controls the rounding of a block’s corners. In most cases, using the same radius for all corners creates a cleaner, more consistent appearance

  • Radius value: Set the amount of corner rounding (typically in px or em)
  • Apply to all corners: By default, the same radius is applied to all corners

You can also control each corner individually:

  • Click the unlink icon to adjust each corner separately

Tips for editors

Use borders consistently

Borders should feel intentional. Reuse similar border styles across a page or section to avoid visual clutter.

Keep corner styles consistent

Mixing different corner radius values can feel inconsistent. Use a consistent radius unless there’s a clear reason not to.

Start subtle

Small border widths and moderate radius values are usually more effective than extreme settings.

Let the design system guide you

Not all border options are available on every block. This is intentional — use the available settings as guidance for what works best within your site’s design.


  1. WordPress.org Border Settings documentation – Please note that your implementation may include customizations that affect available settings or behavior.