Borders are commonly used to separate and distinguish different sections, containers, or individual elements within a page. Borders can be styled as solid, dashed, dotted, double, groove, ridge, inset, outset, or none.

Listed below are some of the border styles that you can add through the site editor or theme editor.

The dashed border style creates a series of short dashes along the border. It's useful for creating a visually distinctive separation between elements.

The dotted border style creates a series of dots along the border. It's often used for decorative purposes or to create a subtle division between elements.

The double border style consists of two parallel lines. It's a bold border style that can be used to emphasize or highlight elements.

The inset border style creates an illusion of the border being carved into the page. It gives a 3D, pressed-in appearance. It makes the element look like it is receding into the background or sinking into the surface. This style is commonly used to add depth and emphasis to certain elements on a site.

The outset border style is the opposite of inset. It creates an illusion of the border popping out from the page.

The hidden border style hides the border, making the element visually appear without any border.

The none border style also removes the border, similar to hidden.

You can mix and match different border styles, colors, widths, and border-radius values to create unique and appealing designs for your site. Borders are an essential aspect, as they help organize content, create visual separation, and enhance the overall aesthetics of a site.