Gerador de Loader CSS
Crie spinners e loaders em CSS puro com 8 estilos (anel, pontos, pulso, barras, etc.). Ajuste cor, tamanho e velocidade. Sem libs, sem GIFs. Tudo no navegador.
Preview
CSS puro, zero JS
Todos os loaders deste gerador usam apenas @keyframes e propriedades CSS — sem GIFs, SVGs ou bibliotecas. Funcionam em qualquer browser moderno e ficam suaves em qualquer DPI.
Cada estilo gera o HTML mínimo e o CSS completo (incluindo animação). Cole no seu projeto e ajuste cor/tamanho via variáveis ou substituindo os valores. Tudo no navegador.
Spinners e loaders em CSS puro
O indicador girando enquanto a página carrega não precisa ser um GIF pesado nem uma biblioteca a mais. Dá pra resolver com CSS puro, leve e nítido em qualquer resolução. Este gerador cria spinners e loaders animados e ainda traz vários estilos prontos pra você escolher.
São oito estilos diferentes: anel, pontos, pulso, barras, entre outros. Você ajusta a cor, o tamanho e a velocidade da animação até bater com a sua interface. Feito isso, é só copiar o CSS, que vem sem dependências externas e sem imagens.
A geração toda fica no navegador. É um caminho prático pra colocar um indicador de carregamento bonito no site mantendo o código leve e sob o seu controle.
Ferramentas Relacionadas
Gerador Cubic Bezier
Crie e visualize curvas cubic-bezier para animações CSS. Arraste os pontos de controle, veja o preview da animação e copie o valor pronto. Inclui presets (ease, ease-in, ease-out). Tudo no navegador.
Gerador de Triângulo CSS
Crie triângulos puros com CSS usando o truque das bordas. Escolha direção (cima, baixo, esquerda, direita), tamanho e cor. Útil para tooltips, setas e ponteiros. Tudo no navegador.
Gerador de Glassmorphism CSS
Crie efeitos de vidro fosco (glassmorphism) com backdrop-filter, transparência e bordas. Ajuste blur, saturação e opacidade. Veja o preview em tempo real e copie o CSS. Tudo no navegador.