π _π .css
A mood-driven CSS framework to write modern websites using only emojis
No complicated classes to remember, and much less typing than traditional verbose methodologies like BEM. Impossibly fast βΒ emojis are only a few bytes each, name mangling out of the box.
π View the demo
Usage
.\β¨οΈ {
/* Makes the β¨οΈ element look like a keyboard key */
border-radius: 4px;
padding: 3px 6px;
font-size: 0.9rem;
}
.\π {
padding: 1rem 1.4rem;
max-width: 100%;
overflow: auto;
}
.\π .\π {
/* When π is in a π, reset it's formatting to blend in */
background: inherit;
font-size: inherit;
color: inherit;
border: 0;
padding: 0;
margin: 0;
}
.\π {
/* Reset the border of the π separator, then set a better line */
border: 0;
border-bottom: 1px solid currentColor;
margin: 1rem auto;
}