houdini-stamp-border v0.1.0

HoudiniStampBorder

CSS Houdini library.

How to use

HTML:

<div class="stamp">
    <div>🐻</div>
    <div class="value">20c</div>
</div>

<script src="https://unpkg.com/css-paint-polyfill"></script>
<script>
    CSS.paintWorklet.addModule("https://unpkg.com/houdini-stamp-border.js")
</script>

CSS

.stamp {
    display: grid;
    justify-content: center;
    height: 180px;
    width: 140px;
    font-size: 70px;

    padding: 14px;
    --stamp-borderRadius: 7;
    --stamp-borderColor: black;
    --stamp-cornerFactor: 1.0;
    background: paint(houdini-stamp-border);
}

.stamp .value {
    font-size: 30px;
    text-align: right;
}