Ferramentas de CSS

Gere CSS limpo e pronto para copiar e colar de forma visual com estas ferramentas gratuitas — sombras (box-shadow), gradientes, border-radius, flexbox, grid, animações, clip-paths e filtros — com uma pré-visualização ao vivo enquanto você ajusta cada valor.

Sombras, filtros e acabamentos

Gerador de Box Shadow CSS

Crie um box-shadow visualmente com pré-visualização ao vivo e copie o CSS.

Gerador de Text Shadow CSS

Crie um text-shadow com pré-visualização ao vivo e copie o CSS.

Gerador de neumorfismo

Crie sombras neumórficas soft-UI com visualização ao vivo e copie.

Gerador de Glassmorphism

Crie CSS de cartão em vidro fosco com blur, transparência, saturação e cor de tonalidade.

Gerador de filtros CSS

Componha filtros CSS com controles deslizantes e visualização ao vivo, depois copie.

Contorno de Texto CSS

Adicione um contorno ou traçado ao texto e copie o CSS.

Estilizador de Barra de Rolagem CSS

Estilize uma barra de rolagem personalizada e copie o CSS ::-webkit-scrollbar.

Formas, degradês e fundos

Gerador de Border Radius CSS

Ajuste o raio de cada canto com pré-visualização ao vivo e copie o CSS.

Gerador de clip-path CSS

Recorte um elemento em formas comuns e copie o CSS de clip-path.

Gerador de Triângulo CSS

Gere um triângulo em CSS puro em qualquer direção e copie o CSS.

Gerador de Gradiente CSS

Crie um gradiente linear ou radial com pré-visualização ao vivo e copie o CSS.

Padrão de fundo CSS

Gere um padrão de fundo CSS com duas cores e copie-o.

Layout e design responsivo

Playground de CSS Flexbox

Experimente propriedades de flexbox em uma prévia ao vivo e copie o CSS gerado.

Gerador de CSS Grid

Gere um layout de CSS grid com colunas, linhas e gap ajustáveis, com prévia ao vivo.

Construtor de media query CSS

Crie uma @media query responsiva com predefinições e copie-a.

Caixa de Proporção CSS

Gere uma caixa de proporção responsiva com alternativa de padding.

Layout Multicoluna CSS

Gere um layout de texto multicoluna CSS com uma linha divisória.

Movimento, transformações e animação

Gerador de CSS Transform

Combine translate, rotate, scale e skew em um único CSS transform com prévia ao vivo.

Gerador de animações CSS

Crie uma animação com keyframes, visualize ao vivo e copie o CSS.

Gerador de Easing CSS

Escolha ou crie um easing cubic-bezier e reproduza-o em um ponto animado de prévia.

Gerador de spinner CSS

Gere um spinner de carregamento em CSS puro e copie o CSS.

Nenhuma ferramenta corresponde a isso.

Explorar outras categorias