<style>
.divider_wrapper {
padding-bottom: 30px;
padding-top: 60px;
}
.divider {
position: relative;
margin-top: 0px;
height: 1px;
}
.div-transparent:before {
content: "";
position: absolute;
top: 0;
left: 5%;
right: 5%;
width: 90%;
height: 1px;
background-image: linear-gradient(to right,transparent,#aaa,transparent);
}
.div-arrow-down:after {
content: "";
position: absolute;
z-index: 1;
top: -7px;
left: calc(50% - 7px);
width: 14px;
height: 14px;
transform: rotate(45deg);
background-color: white;
border-bottom: 1px solid #aaa;
border-right: 1px solid #aaa;
}
</style>
<div class="divider_wrapper">
<div class="divider div-transparent div-arrow-down">
</div>
</div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter