12 OCT · MADRID
Noches de diseño
Una conversación sobre ideas, producto y cultura visual.
HTML + CSSCards
Entrada para eventos
Una tarjeta con forma de entrada cuya matriz perforada se separa un poco al pasar el ratón.
Ajustes
16px
1x
Código
<article class="uv-cticket"><div><small>12 OCT · MADRID</small><h3>Noches de diseño</h3><p>Una conversación sobre ideas, producto y cultura visual.</p></div><aside><b>20:30</b><span>Puerta 04</span><i>⌁</i></aside></article>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 Cards
Dónde usarlo
Cuando una card normal se queda corta para un evento, una entrada lo dice todo de un vistazo. Úsala en la confirmación de una charla de diseño o en la pantalla «Mis entradas» de la app de un festival. Esta tarjeta de entrada en HTML y CSS tiene muescas y una línea de corte discontinua.
Las muescas de los lados usan el color de fondo de la página, así que colócala sobre un fondo liso, no sobre una foto. En la matriz caben dos datos cortos como mucho; si metes más, el texto salta de línea y se pierde el efecto.