This is a collection of pre-defined animations.
You need to import the CSS file and assign the data attribute to use them.
@import "ssstyles/css/animations.css" layer(components);
# Sparkle
I'm just a little bit <em data-sparkle>extra</em>
I'm just a little bit extra
# Fade in
This animation lets the element fade in fron the bottom when scrolling into the viewport.
<div data-card data-fade-in>Let the ruling classes tremble at a layered revolution.</div>
<div data-card data-fade-in>The element selectors have nothing to lose but their specificity.</div>
<div data-card data-fade-in>They have a stylesheet to win.</div>
Let the ruling classes tremble at a layered revolution.
The element selectors have nothing to lose but their specificity.
They have a document to win.