HTML + CSSCheckboxes

Subrayador fluorescente

En una hoja de cuaderno, al marcar la casilla un trazo de fosforito pasa por detrás de la frase.

Ajustes

16px
1x

Código

<label class="uvq02-hil"><input type="checkbox"><span class="bx"><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 class="tx">Repasar el tema 4</span></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 está en una hoja de cuaderno rayada con su margen rojo. Al marcarlo, el check se dibuja con bolígrafo y un trazo de fosforito pasa por detrás de la etiqueta, algo inclinado y con los extremos irregulares, como cae un rotulador de verdad. Al pasar el ratón asoma la punta. Encaja en agendas de estudio, listas de lectura, apps para repasar y herramientas de notas.

El color principal es la tinta del subrayador, de lima a rosa o naranja, y el secundario el bolígrafo de la casilla y el check. Deja las etiquetas en una sola línea, porque el trazo sigue una única fila de texto.