<div class="wrap"><svg viewBox="0 0 300 310" preserveAspectRatio="xMidYMid slice" width="100%" height="100%">
<defs>
<g id="fleur">
<rect class="wing" x="18" y="73" width="64" height="11" rx="5.5"/>
<path class="wing" d="M50,22 C44,36 40,56 46,73 C48,79 52,79 54,73 C60,56 56,36 50,22 Z" transform="rotate(-34 50 77)"/>
<path class="wing" d="M50,22 C44,36 40,56 46,73 C48,79 52,79 54,73 C60,56 56,36 50,22 Z" transform="rotate(34 50 77)"/>
<path class="body" d="M50,10 C42,26 37,50 44,70 C47,78 53,78 56,70 C63,50 58,26 50,10 Z"/>
<path class="body" d="M38,84 C38,102 43,116 50,130 C57,116 62,102 62,84 Z"/>
<circle class="wing" cx="50" cy="134" r="7"/>
</g>
<pattern id="pd" width="100" height="155" patternUnits="userSpaceOnUse">
<rect width="100" height="155" fill="#4a2f3a"/>
<use href="#fleur" x="0" y="4"/>
<animateTransform attributeName="patternTransform" type="translate" from="0 0" to="0 -155" dur="16s" repeatCount="indefinite"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="url(#pd)"/>
</svg></div><span class="tag">damask</span>
.wrap{position:absolute;inset:0;overflow:hidden}
.wing{fill:#66404e}
.body{fill:#7c5262}
.tag{position:absolute;left:10px;bottom:8px;padding:3px 9px;border-radius:999px;background:rgba(255,255,255,.16);
color:#f3e8ea;font:600 10px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.03em}