HTML + CSSBotones

Diana de tiro con arco

Pulsa la diana y una flecha se clava justo donde apuntas; cada tanda de tres flechas suma su puntuación.

Ajustes

16px
1x

Código

<div class="uvq01-arc"><button class="tg" type="button" aria-label="Disparar flecha"></button><span class="sc" aria-hidden="true"><b class="s">-</b><b class="s">-</b><b class="s">-</b><span class="tl">Total</span><b class="sum">0</b></span><span class="sr" role="status"></span></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.

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

Más en Botones

Ver todos: Botones

Dónde usarlo

Una diana de tiro con arco con anillos oro, rojo, azul, negro y blanco dentro de un marco color paja. Cada clic lanza una flecha que se clava donde estaba el puntero, vista desde atrás con sus plumas, y la diana tiembla con el impacto. El anillo da los puntos, se llenan tres casillas y se anuncia el total. Un cuarto tiro limpia la tanda. Divertido para clubes y juegos.

El color principal son las plumas y el secundario el centro dorado, así que puedes usar los colores de tu equipo. Con el teclado, Intro o Espacio disparan cerca del centro con algo de dispersión, y el movimiento reducido quita el vuelo de la flecha.