Menú de dificultad retro
La pantalla de una consola de 8 bits con líneas de barrido: un cursor de píxeles parpadea junto a la dificultad elegida.
Ajustes
Código
<fieldset class="uvq04-px"><legend>Dificultad</legend><label><input type="radio" name="uvq04-px"><i class="cu" aria-hidden="true"></i><span class="tx">Fácil</span><span class="pw" aria-hidden="true"><i class="on"></i><i></i><i></i><i></i></span></label><label><input type="radio" name="uvq04-px" checked><i class="cu" aria-hidden="true"></i><span class="tx">Normal</span><span class="pw" aria-hidden="true"><i class="on"></i><i class="on"></i><i></i><i></i></span></label><label><input type="radio" name="uvq04-px"><i class="cu" aria-hidden="true"></i><span class="tx">Difícil</span><span class="pw" aria-hidden="true"><i class="on"></i><i class="on"></i><i class="on"></i><i></i></span></label><label><input type="radio" name="uvq04-px"><i class="cu" aria-hidden="true"></i><span class="tx">Pesadilla</span><span class="pw" aria-hidden="true"><i class="on"></i><i class="on"></i><i class="on"></i><i class="on"></i></span></label><p class="pr" aria-hidden="true">Pulsa espacio</p></fieldset>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 Radio buttons
Ver todos: Radio buttonsDónde usarlo
Este grupo de radios es la pantalla de dificultad de una consola antigua, dibujada sobre un CRT curvo con líneas de barrido, un ligero parpadeo y viñeta oscura. Una flecha de píxeles escalonada parpadea junto al nivel elegido, su nombre brilla en amarillo y una fila de bloques rosas indica lo difícil que es. Funciona en juegos, cursos con retos, niveles de dificultad y portadas nostálgicas.
El color principal es el cursor y el texto elegido, y el secundario el título y los bloques. Deja las etiquetas en mayúsculas y por debajo de diez letras para que quepan en una línea, y cambia el aviso parpadeante de abajo según tus controles.