#dedinsidekonachan

[dedinsidekonachan]

i made a html+css animated divider. free to use on your own website, just copy-paste

you can turn any text into a divider! just search for "♛" and replace it with the symbol you want

code is below

<style> .divider { width: 100%; height: 16px; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cstyle%3E text %7B font: 16px sans-serif; text-anchor: middle; dominant-baseline: central; stroke-width: 0; %7D %3C/style%3E%3Ctext x='8' y='8'%3E♛%3C/text%3E%3C/svg%3E"); mask-repeat: repeat-x;

background-color: red; animation: 0.3s linear 0s infinite slide-across, 0.6s linear 0s infinite alternate shift-hue; }

@keyframes slide-across { from { mask-position: 0px 0px; } to { mask-position: 16px 0px; } }

@keyframes shift-hue { from { filter: hue-rotate(0deg); } to { filter: hue-rotate(360deg); } } </style>