Los separadores son líneas que se utilizan para separar contenidos de texto dándole una elegancia diferente.
A continuación te dejo los ejemplos:
Separador básico:
<hr>
Separador con anchura:
<hr width="50%"/>
Separador con anchura y alineado a la derecha:
Coloca en lugar de right, center si lo quieres al centro o left si es a la izquierda.
<hr width="50%" align="right"/>
Separador con tamaño:
<hr size="20"/>
Separador con color:
<hr color="#FF0000"/>
Separador con sombra:
<hr noshade="noshade"/>
También personalizándolo un poco más, le colocamos un poco de CSS:
Le podrás cambiar color de fondo del separador
El tamaño de cada uno de los bordes, estilos y colores
Lo alto del separador y lo ancho, así como la alineación del mismo.
<hr style="background-color:#333333; border-left:5px solid #009900; border-right:5px solid #FF0000; border-top:5px solid #FFCC00; border-bottom:5px solid #003366; height:10px; width:100%; align:center;" />
O si prefieres colocarle una imagen de fondo:
<hr style=" background-image:url(Url-de-tu-imagen); border-left:5px solid #003300; border-right:5px solid #FF0000; border-top:5px solid #FFCC00; border-bottom:5px solid #088A85; height:10px; width:100%; align:center;" />
Si necesitas otros estilos de bordes los puedes verlos en esta entrada.
Espero te sirvan en algo.