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.
Table of Contents
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.
Related learning resources
- WordPress.org Border Settings documentation – Please note that your implementation may include customizations that affect available settings or behavior.