Loading…
Background, border, radius, padding, shadow, and an optional hover lift that animates on the compositor instead of fighting layout. Previewed with real content, copied as the exact rule the preview uses.
Card title
Sample content so the padding and radius read against something real. The card rule styles the container, not this text.
The CSS
.my-card {
background: #ffffff;
border: 1px solid #e7e5e4;
border-radius: 14px;
padding: 24px;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
transition: transform 180ms ease, box-shadow 180ms ease;
}
.my-card:hover {
transform: translateY(-4px);
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16);
}Set what you want and the result appears as you go. Nothing needs uploading because there is nothing to upload — you are describing what to make, not sending us anything.
Your browser does all the work locally, using your own operating system where randomness is involved. Nothing is requested from a server, so nobody else has a copy of what you made.
One press puts it on your clipboard, ready to paste where you need it. There is no file to download — the result is text, not a document. Nothing is kept — refresh the page and it’s gone, so take what you need before you leave.