More Line Block Styles

Look Demo

Upgrade the line block with these additional styles. This plugin uses css editor and works with all template families.

How To Install

From your Squarespace account, go to the Custom CSS Editor. There are 5 styles available. Copy and paste one of the codes below into the Custom CSS Editor box.

// Line Block Size // 

.sqs-block-horizontalrule hr {
height: 8px !important;/*adjust the line size*/
}


// Dotted Line //

.sqs-block-horizontalrule hr {
background: transparent!important;
border-top: 3px dotted #50bdb8;/*adjust the line color and size*/
}


// Dashed Line // 

.sqs-block-horizontalrule hr {
background: transparent!important;
border-top: 3px dashed #50bdb8;/*adjust the line color and size*/
}


// Striped Line //

.sqs-block-horizontalrule hr {
background: #df89a4;/*adjust the small stripe color*/
border-top: 10px dashed #ffcfdd;/*adjust the big stripe color*/
}


// Double Line //

.sqs-block-horizontalrule hr {
background: #df89a4 ;/*adjust the bottom line color*/
height: 5px!important;/*adjust the bottom line size*/
border-top: 5px solid #50bdb8;/*adjust the top line size and color*/
}

Customize

Based on which style you pick, change the background, border, or height to your liking.

License

This plugin comes with an Unlimited Use License. View License Terms

Previous
Previous

Slightly Angled Text

Next
Next

Gradient Index Image Background