Moneda que gira

Una moneda salta y da vueltas en 3D para pasar de la cara del euro a la del dólar.

Ajustes

Color principal#e8b53a

Color secundario#b8c1cc

Tamaño16px

Velocidad1x

Texto

Código

index.html

<label class="uvq03-con"><input type="checkbox" role="switch"><span class="st"><span class="cn"><b class="f a">€</b><b class="f b">$</b></span><i class="sd"></i></span>Precios en dólares</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 Toggles

Ver todos: Toggles

Toggle iOS elástico

TogglesHTML + CSS

Toggle día y noche

TogglesHTML + CSS

Interruptor ON / OFF

TogglesHTML + CSS

Interruptor neón

TogglesHTML + CSS

Toggle con cruz y check

TogglesHTML + CSS

Toggle neumórfico

TogglesHTML + CSS

Interruptor de pared

TogglesHTML + CSS

Toggle líquido

TogglesHTML + CSS

Dónde usarlo

Este interruptor es una moneda de dos caras: una dorada con el símbolo del euro y otra plateada con el del dólar. Al cambiarlo, la moneda salta un poco y gira varias veces en 3D antes de caer por la otra cara, mientras su sombra en el suelo se encoge y crece. Un script corto repite el salto. Encaja en selectores de moneda, páginas de precios y tiendas.

Los dos colores definen el metal de cada cara. Cambia los símbolos del HTML por libras, yenes o cualquier par de opciones, y deja claro en el texto qué significa la cara activa.