How to Create Horizontal Lines

Sometimes we need to visually break up blocks of text. One way to create visual breaks is to create lines. This page gives you the code to create single lines and colored doubled lines. 

<hr />

<hr style="border: 0; border-top: 5px double #119a00;" /> 

Single Line Style

Double Line Style

You can change the color of the double line by adding a new hex code. You can easily find hex codes here Links to an external site..

Don't forget that color is an accessibility concern, so be sure to choose colors with enough contrast that they can be easily viewed (the built-in accessibility checker will also help.) 

Practice

• Open a blank content page and switch to the HTML editor. 
• Copy the code included above into the HTML editor. You can change the color and thickness for the double line if you want.
• Switch back to "rich text editor" and see what your changes have done. 
• Add the sample code to the note page app on your computer or a reference page on Canvas. You can copy/paste the sample code anytime you need it.