← All elements
<article class="pc-receipt">
<h3>Order #4821</h3>
<ul>
<li><span>Linen Tee</span><span>₱1,200</span></li>
<li><span>Canvas Tote</span><span>₱650</span></li>
<li><span>Shipping</span><span>₱0</span></li>
</ul>
<p class="pc-receipt__total"><span>Total</span><span>₱1,850</span></p>
</article>About this card
An order receipt with a torn zigzag bottom edge cut by a conic-gradient mask, so it works on any background colour. Open an example, copy the HTML and the CSS, and paste them into your page. There is nothing to install and no JavaScript to load.