Dividers

Add horizontal and vertical dividers to separate sections in your templates. Customize thickness and color with a simple slider.

Overview

Dividers are simple line elements that help organize your document layout:

Adding Dividers

Method 1: Quick Add Menu

1. Select any element on the canvas
2. Click the + Add button in the toolbar
3. Choose Divider or Vertical Divider from Quick Add

Method 2: Blocks Panel

1. Open the Blocks panel (left sidebar)
2. Look in the Content category
3. Drag Divider or Vertical Divider onto your canvas

Method 3: Keyboard Shortcut

1. Press / anywhere on the canvas
2. Type "divider" to filter
3. Click to insert

Customizing Thickness

Once you add a divider, you can easily adjust its thickness:

1. Select the divider on your canvas
2. Open the Design tab in the right sidebar
3. You'll see the header shows "Horizontal Divider" or "Vertical Divider"
4. Use the Thickness slider to adjust (1px to 10px)

The slider provides real-time feedback - you'll see the divider change as you drag.

Thickness Guidelines

Changing Color

Below the thickness slider, you'll find color presets:

Using Brand Colors

1. Click the 🎨 button
2. Enter your brand color code or use the color picker
3. The divider updates instantly

Video Tutorial

Watch how to add and customize dividers in Template Builder:

Tips

• Vertical dividers work best inside flex containers or table cells
• Use consistent thickness throughout your document for a professional look
• Match divider colors with your overall color scheme
• For subtle separation, use light colors with thin lines (1-2px)

Related Articles

• Template Builder Overview - Full editor guide
• Pre-built Blocks - All available blocks