Pizarra de tiza
Un área de texto sobre pizarra con marco de madera: el trazo parece tiza, eliges color en la repisa y el borrador lo barre.
Ajustes
Código
<div class="uvq06-ch"><svg class="fx" aria-hidden="true" width="0" height="0"><filter id="uvq06-ch-f"><feTurbulence type="fractalNoise" baseFrequency="1.1" numOctaves="2" result="n"/><feDisplacementMap in="SourceGraphic" in2="n" scale="2"/></filter></svg><div class="bd"><label class="sl"><span class="sr">Escribe en la pizarra</span><textarea rows="4" spellcheck="false" placeholder="Escribe en la pizarra"></textarea></label><span class="er" aria-hidden="true"></span></div><div class="lg"><div class="ck" role="radiogroup" aria-label="Color de la tiza"><label style="--k:#f4f1e8"><input type="radio" name="uvq06-ch-k"><span class="sr">Blanca</span></label><label style="--k:var(--c1)"><input type="radio" name="uvq06-ch-k"><span class="sr">Color principal</span></label><label style="--k:var(--c2)"><input type="radio" name="uvq06-ch-k"><span class="sr">Color secundario</span></label></div><button type="button" class="rb"><span>Borrar</span></button></div></div>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 Inputs
Ver todos: InputsDónde usarlo
Un área de texto sobre una pizarra con marco y repisa de madera. Un pequeño filtro de turbulencia en SVG vuelve rugosas las letras para que parezcan de tiza, hay manchas suaves sobre la pizarra y las tizas de la repisa son botones de opción reales que cambian el color. El borrador de fieltro barre la pizarra y deja una nube que se desvanece.
Usa los dos colores para las tizas amarilla y rosa y deja la blanca por defecto. Encaja en cartas de cafetería, apps escolares, platos del día y listas de tareas, y con tres o cuatro líneas cortas esa letra se lee mejor.