Giroscopio 3D

Tres anillos giran sobre ejes distintos alrededor de un núcleo que brilla.

Ajustes

Color principal#14b8a6

Color secundario#f97316

Tamaño16px

Velocidad1x

Código

index.html

<div class="uv-lgy" role="status"><span class="sr">Cargando</span><i class="r1"></i><i class="r2"></i><i class="r3"></i><i class="co"></i></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 Loaders

Ver todos: Loaders

Spinner circular

LoadersReact + Motion

Puntos rebotando

LoadersReact + Motion

Barra de progreso indeterminada

LoadersReact + Motion

Skeleton de tarjeta

LoadersReact + Motion

Cuadrado que se vuelve círculo

LoadersHTML + CSS

Cuadrados que cambian de sitio

LoadersHTML + CSS

Cubo 3D

LoadersHTML + CSS

Triángulo que se dibuja

LoadersHTML + CSS

Dónde usarlo

Un giroscopio sugiere equilibrio y precisión, perfecto para fintech, aeroespacial, robótica y productos científicos. Tres anillos concéntricos giran sobre ejes inclinados distintos dentro de una perspectiva 3D, cruzándose por delante y por detrás, mientras un núcleo luminoso en el centro respira con un brillo suave.

Los anillos exterior y medio usan tus dos colores y el interior mezcla ambos. Todo va con transformaciones CSS 3D y preserve-3d, así que es fluido y ligero, y la velocidad escala los tres anillos a la vez.