css

Gerador de Paleta de Cor — Escolha uma cor base e gerar uma paleta de harmonia — complementar, análogo, triádico, tetradic,...

Gerador de Gradientes CSS — Construa gradientes CSS lineares, radiais ou cônicos visualmente. Adicione paradas de cores ilimitadas, arraste o ângulo, veja a visualização ao vivo, e...

Box Shadow Generator — Build CSS box-shadow visualmente — ajuste offset, borrão, spread, cor, opacidade e inset com visualização ao vivo.

Color Contrast Checker — Escolha uma cor de primeiro plano e de fundo e veja instantaneamente a relação de contraste WCAG 2.1 com crachás passe/falha para AA e AAA, norma...

Minify CSS código online. Remova comentários, espaços em branco e caracteres desnecessários para reduzir o tamanho do arquivo. Minificador CSS gratuito — resultados instantâneos.

Minificador de código online gratuito. Comprima o código HTML, CSS e JavaScript instantaneamente em um só lugar. Remove comentários, espaço em branco e formatação para otimizar a velocidade.

Visualmente craft CSS border-radius — cantos independentes, unidades px/%/em e formas blob orgânicas. Visualização ao vivo e copy-paste CSS. Funciona no seu navegador.

Design de CSS de vidro fosco com visualização ao vivo — borrar, saturação, preencher opacidade, borda e sombra. Copiar filtro de fundo CSS. Funciona no seu navegador.

Crie formas clip-path CSS visualmente — polígonos, círculos, insets e predefinições 20+ com pontos arrastáveis. Visualização ao vivo e copy-paste CSS, em seu navegador.

Design CSS cúbico-bezier flexibilização curvas com um editor arrastável, predefinições, e uma visualização de animação ao vivo. Copie o CSS de função de tempo, tudo no seu navegador.

Design CSS text-shadow visualmente — empilhe várias camadas, escolha neon, 3D, esboço e retro predefinições, em seguida, copie o CSS. Visualização ao vivo, é executado no seu navegador.

Crie neuromorfismo soft-UI CSS visualmente — cor base, direção de luz, forma e distância de sombra. Copiar caixa-sombra CSS. Visualização ao vivo no seu navegador.

Faça triângulos CSS com o truque de borda — escolha direção, largura, altura e cor, visualize ao vivo e copie a largura/altura/fronteira CSS. Funciona no navegador.

Construa visualmente um filtro CSS — borrão, brilho, contraste, escala de cinza, matiz, sépia e drop-shadow — visualização em sua própria imagem e copie o CSS. In-browser.

Construa CSS transforma visualmente — traduza, escale, gire, gire mais rotações 3DX/Y/Z e perspectiva. Visualização ao vivo em uma grade e cópia do CSS, in-browser.

Crie animações CSS @keyframes — desvanecer, deslizar, saltar, pulsar, girar, inverter, ampliar — duração da melodia, aliviar, atrasar e loop, visualizar ao vivo e copiar o CSS.

Um playground visual do CSS flexbox — ajustar a direção, justificar, alinhar, envoltório e gap, assistir à visualização ao vivo e copiar o CSS do contêiner. Funciona no seu navegador.

Um playground de grade CSS visual — definir colunas, linhas, lacunas e dimensionamento de faixas, assistir à visualização ao vivo e copiar a grade gerada CSS. Funciona no seu navegador.

Projete um botão CSS visualmente — enchimento, cores, gradientes, raios-fronteira, efeitos de sombra e hover — com uma visualização ao vivo, em seguida, copie o CSS. In-browser.

Estilo barras de rolagem personalizadas visualmente — largura, faixa e cores do polegar, pairar e raio — com uma visualização WebKit ao vivo e recurso Firefox. Entendido.

Escreva HTML, CSS, JS em editores tabulados com visualização iframe ao vivo. Executar automaticamente, baixar como arquivo HTML. Amostra pré-carregada da aplicação. Nenhum servidor — navegador puro.

Calcular e comparar a especificidade do seletor CSS instantaneamente. Veja (a,b,c), visualize com gráficos de barras e descubra qual seletor ganha. Ferramenta de desenvolvedor gratuita.

Conversor de unidade css on-line gratuito. Sem inscrição, sem envio — funciona inteiramente no seu navegador. Rápido, privado e livre para sempre.

Gere spinners de carregamento CSS puros, pontos, pulsos, barras, anéis e muito mais. Personalize cores, tamanho e velocidade. Copie CSS + HTML instantaneamente.

Crie caixas de seleção CSS personalizadas com os estilos tick, cruz, preenchimento ou menos. Tamanho de controle, cores, raio de borda. Visualização ao vivo e cópia CSS.

Desenhar interruptores CSS personalizados. Controle largura, altura, cores ligadas/desligadas, tamanho do botão, velocidade de animação e etiquetas. Visualização ao vivo e código de cópia.

Crie efeitos de texto de falha CSS estilo cyberpunk. Controle intensidade, cores de deslocamento ciano/magenta, velocidade de animação e inclinação. Visualização ao vivo e cópia CSS.

Gere padrões de fundo CSS puros — listras, pontos, grades, tabuleiros de xadrez e muito mais. Código CSS pronto para cópia, sem necessidade de imagens.

Discover 20 curated Google Font pairings for headings and body text. Filter by style (modern, classic, playful, professional, minimal). Copy @import and CSS for each pair.

Design custom CSS toggle switches with iOS, material, flat, 3D, and neumorphic styles. Live preview, copy HTML + CSS. Customize colors, size, labels, and animation speed.

Build React Native shadows visually. Control shadowColor, offset, radius, opacity, and Android elevation. Live preview on a phone mockup. Copy JSX code.

Generate beautiful CSS background patterns with pure CSS gradients — stripes, dots, checkerboard, waves, zigzag, and more. Live preview, copy CSS, free and instant.

Build CSS box-shadow with multiple layers. Tune offset, blur, spread, color, opacity and inset for each shadow. Live preview and copy-ready CSS.

Generate a cyberpunk CSS glitch text effect with keyframes. Customize text, primary and secondary colors, animation speed, and glitch intensity.

Gere padrões de fundo SVG sem costura: bolinhas, listras, chevron, hexágonos, ondas e muito mais. Personalize cores e espaçamento. Baixe SVG ou CSS.

Gerar 10 tons (50-950) de qualquer cor hex, como Tailwind CSS. Ver swatches, clique para copiar hex, exportar como configuração Tailwind ou variáveis CSS.

Misture duas cores com passos de gradiente configuráveis. Veja a visualização do gradiente e copie o código linear-gradiente CSS. Liquidificador de cor online gratuito.

Verificador de tamanho de fonte online gratuito. Verifique se seus tamanhos de fonte atendem aos requisitos mínimos de legibilidade e acessibilidade do WCAG 2.1.