UTILS.
Privadas por padrão
◇

Gerador de clip-path CSS

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

Seus arquivos ficam neste dispositivo

Os arquivos são processados no navegador, nunca enviados. O site baixa o código e os recursos necessários. Sem contas ou rastreadores.

Use Baixar para salvar esta ferramenta em um único arquivo HTML para uso offline.

Privacidade →

Sobre esta ferramenta

Escolha uma forma e recorte instantaneamente uma caixa de visualização com a regra clip-path correspondente, depois copie o CSS pronto para usar. A visualização é atualizada em tempo real, totalmente no seu navegador.

Perguntas frequentes

Como funcionam os clip-paths de polígono?
Cada ponto é um par de porcentagens x y relativo à caixa; o navegador os conecta em ordem e mostra apenas a área dentro do contorno.
Todos os navegadores oferecem suporte a clip-path?
As formas polygon, circle, ellipse e inset têm suporte em todos os navegadores modernos, então o CSS gerado funciona sem prefixos.

Mais ferramentas