Divider Lines

First time using these divider lines?

Make sure to read the Info & Notes section so you know how they work.

Jump to Info & Notes

DIVIDER LINES: COPY & PASTE

All divider lines are available below for copying and pasting in the Visual Editor.

Divider lines use selection bars, but you will need to replace the placeholder paragraphs, rather than completely deleting them, as that will delete the divider line.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

Start of Selection. Replace this text, instead of deleting the paragraph.

End of Selection. Replace this text, instead of deleting the paragraph.

 

GIF showing process of copying and pasting divider line

DIVIDER LINES: INFO & NOTES

Divider lines allow you to break up content and visually divide your pages into sections.

Ways you can use divider lines in Canvas…

  • Add them between sections for additional clarity.
  • Separate multiple sections with similar types, such as blocks of contact information.

Notes

  • Most elements in this design library have 20px space above and below them. Divider lines have 40px space above and below them to better distinguish the content.
  • You are welcome to mix and match these however you want.

Back to Top