Patrón de costura por tallas
Un patrón de papel con las tallas escaladas una dentro de otra: la elegida se marca en rojo y las demás se apagan.
Ajustes
Código
<fieldset class="uvq04-pat"><legend>Talla del patrón</legend><div class="pp" aria-hidden="true"><svg class="dr" viewBox="14 2 86 92"><path class="g g1" d="M30 24Q42 22 46 10L70 16Q66 38 82 44L79 88L30 90Z" transform="translate(30 90) scale(0.82) translate(-30 -90)" vector-effect="non-scaling-stroke" stroke-dasharray="none"/><path class="g g2" d="M30 24Q42 22 46 10L70 16Q66 38 82 44L79 88L30 90Z" transform="translate(30 90) scale(0.88) translate(-30 -90)" vector-effect="non-scaling-stroke" stroke-dasharray="5 3"/><path class="g g3" d="M30 24Q42 22 46 10L70 16Q66 38 82 44L79 88L30 90Z" transform="translate(30 90) scale(0.94) translate(-30 -90)" vector-effect="non-scaling-stroke" stroke-dasharray="1 2.6"/><path class="g g4" d="M30 24Q42 22 46 10L70 16Q66 38 82 44L79 88L30 90Z" transform="translate(30 90) scale(1) translate(-30 -90)" vector-effect="non-scaling-stroke" stroke-dasharray="7 2 1.5 2"/><path class="g g5" d="M30 24Q42 22 46 10L70 16Q66 38 82 44L79 88L30 90Z" transform="translate(30 90) scale(1.06) translate(-30 -90)" vector-effect="non-scaling-stroke" stroke-dasharray="10 3"/><path class="gl" d="M54 36V72M51 40L54 36L57 40M51 68L54 72L57 68"/><path class="fd" d="M25 28V86"/></svg><svg class="sc" viewBox="0 0 24 24"><circle cx="6" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M8.6 7.6L20 16M8.6 16.4L20 8"/></svg><p class="tx">Delantero · cortar 1 al doblez</p></div><div class="op"><label><input type="radio" name="uvq04-pat"><span><svg viewBox="0 0 24 6" aria-hidden="true"><path d="M1.5 3H22.5" stroke-dasharray="none"/></svg><b>36</b></span></label><label><input type="radio" name="uvq04-pat"><span><svg viewBox="0 0 24 6" aria-hidden="true"><path d="M1.5 3H22.5" stroke-dasharray="5 3"/></svg><b>38</b></span></label><label><input type="radio" name="uvq04-pat" checked><span><svg viewBox="0 0 24 6" aria-hidden="true"><path d="M1.5 3H22.5" stroke-dasharray="1 2.6"/></svg><b>40</b></span></label><label><input type="radio" name="uvq04-pat"><span><svg viewBox="0 0 24 6" aria-hidden="true"><path d="M1.5 3H22.5" stroke-dasharray="7 2 1.5 2"/></svg><b>42</b></span></label><label><input type="radio" name="uvq04-pat"><span><svg viewBox="0 0 24 6" aria-hidden="true"><path d="M1.5 3H22.5" stroke-dasharray="10 3"/></svg><b>44</b></span></label></div></fieldset>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Radio buttons
Ver todos: Radio buttonsDónde usarlo
Como un patrón de costura multitalla de verdad, cinco contornos de cuerpo van uno dentro de otro sobre papel de seda cuadriculado, cada talla con su propio tipo de línea: continua, discontinua, punteada o de trazo y punto. Al elegir una talla su contorno se traza en rojo, las demás se apagan y las tijeras dan un corte. Útil para tiendas de patrones y cursos de moda.
El color principal marca la talla elegida y el secundario el papel. Los cinco contornos comparten un mismo trazado SVG escalado desde el doblez, así que puedes cambiarlo por una manga o una falda y mantener el escalado.