HTML + CSSCheckboxes

Rodillo y masa

Sobre una tabla enharinada, el rodillo pasa rodando y aplasta la bola de masa hasta dejarla estirada.

Ajustes

16px
1x

Código

<label class="uvq02-rol"><input type="checkbox"><span class="bd" aria-hidden="true"><i class="dg"></i><span class="pn"></span><span class="ok"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12.5l4.5 4.5L19 7.5" pathLength="1"/></svg></span></span>Estirar la masa</label>

Prompt para IA

Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.

Versión Markdown con todo el código, para asistentes de IA

Más en Checkboxes

Ver todos: Checkboxes

Dónde usarlo

Este checkbox es una tabla de madera enharinada con una bola de masa en el centro y un rodillo apoyado a un lado. Al marcarlo, el rodillo cruza la tabla girando su veta, aplasta la masa hasta dejarla ancha e irregular y aparece una pequeña insignia con un check en la esquina. Encaja en apps de repostería y recetas de pizza.

El color principal es la insignia del check y el secundario la masa, así que puedes pasar de una masa clara a una integral o a una verde de espinacas. Deja la etiqueta como una acción clara, igual que un paso de receta.