CSS Spiked Separator Generator
Generate code for spiked separators, This page allows you to easily create eye-catching dividers between your website's content or sections.
Preview
Code
<section class="spiked">
<!-- Your content goes here -->
</section>CSS
.spiked {
height: 50%;
background-color: #586e7e;
position: relative;
}
.spiked:after {
position: absolute;
content: '';
right: 0;
left: 0;
top: 100%;
z-index: 1;
display: block;
height: 80px;
background-size: 80px 100%;
background-image:
linear-gradient(135deg, #586e7e 25%, transparent 25%),
linear-gradient(225deg, #586e7e 25%, transparent 25%);
}