Garment care label wash picker
A satin care label sewn into a seam: choose a wash temperature and its symbol gets outlined in blue stitching.
Settings
Code
<fieldset class="uvq04-care"><legend>Washing</legend><div class="sm" aria-hidden="true"></div><div class="lb"><p class="cm" aria-hidden="true">92% cotton<br>8% elastane</p><label><input type="radio" name="uvq04-care"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 9h18l-2.2 10H5.2z"/><path d="M3 9c2-1.8 4 1.8 6 0s4 1.8 6 0 4 1.8 6 0"/><path d="M10 17.5v-3.2M12 17.5v-3.8M14 17.5v-3.2M9 15.8l1 1.7h4"/></svg><span><b>By hand</b><small>Delicates</small></span></label><label><input type="radio" name="uvq04-care"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 9h18l-2.2 10H5.2z"/><path d="M3 9c2-1.8 4 1.8 6 0s4 1.8 6 0 4 1.8 6 0"/><circle class="f" cx="12" cy="14.5" r="1"/></svg><span><b>30 °C</b><small>Wool and silk</small></span></label><label><input type="radio" name="uvq04-care" checked><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 9h18l-2.2 10H5.2z"/><path d="M3 9c2-1.8 4 1.8 6 0s4 1.8 6 0 4 1.8 6 0"/><circle class="f" cx="10.3" cy="14.5" r="1"/><circle class="f" cx="13.7" cy="14.5" r="1"/></svg><span><b>40 °C</b><small>Colours</small></span></label><label><input type="radio" name="uvq04-care"><svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 9h18l-2.2 10H5.2z"/><path d="M3 9c2-1.8 4 1.8 6 0s4 1.8 6 0 4 1.8 6 0"/><circle class="f" cx="8.6" cy="14.5" r="1"/><circle class="f" cx="12" cy="14.5" r="1"/><circle class="f" cx="15.4" cy="14.5" r="1"/></svg><span><b>60 °C</b><small>White cotton</small></span></label><p class="mk" aria-hidden="true">Made in Portugal</p></div></fieldset>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Radio buttons
See all Radio buttonsWhere to use it
A white satin care label hangs from a knitted seam, with the fibre content at the top and four laundry symbols drawn as SVG: hand wash and the tub with one, two or three dots. Choosing a row inks its symbol in blue, pops it in and surrounds the row with a dashed stitch line. It works for laundry apps, clothing product pages and textile care guides.
The main color is the stitched ink and the secondary color the jersey seam. Change the composition, the country line and the four programmes to match your garment, and keep each description to a few words.