Gerador de Spinners CSS Gere spinners de carregamento em CSS e loaders animados com estilos personalizáveis.

Os spinners CSS usam animações @keyframes para criar movimento contínuo. A técnica de border spinner usa um elemento circular com uma borda transparente na maioria dos lados e uma borda colorida em um lado, então o rotaciona 360 graus. A animação de dots usa transformações de escala para criar um efeito saltitante com atraso de animação escalonado. A animação pulse dimensiona um elemento de 0 a 1 enquanto desvanece a opacidade. Todas as animações usam animation: name duration timing-function iteration-count. Definir iteration-count como infinito garante o looping contínuo. A função de temporização da animação (ease, linear, ease-in-out) controla a curva de velocidade. Para acessibilidade, adicione role="status" e uma aria-label aos spinners. Considere usar a consulta de mídia prefers-reduced-motion para desabilitar ou reduzir as animações para usuários que preferem movimento reduzido.