Gerador de caminho de clipe CSS
Crie polígonos e molde caminhos de recorte com uma visualização interativa. Ótimo para formas de heróis e máscaras de imagem.
CSS Clip Path Generator
LiveCSS output
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
Key capabilities
- Crie polígonos e molde caminhos de recorte com uma visualização interativa.
- Executa no seu navegador
- Grátis para usar
Como usar
- Escolha uma forma predefinida ou pontos poligonais.
- Ajuste os pontos conforme necessário.
- Copie o CSS do caminho do clipe.
How this tool works
- Escolha uma forma predefinida ou pontos poligonais.
- Ajuste os pontos conforme necessário.
- Copie o CSS do caminho do clipe.
Recommended settings
- Use as opções padrão primeiro e depois ajuste se necessário
Supported formats
Text / on-page input
File size and limits
- Visualizações multicamadas muito complexas podem parecer mais lentas em telefones mais antigos.
Privacy
Os geradores de cores e CSS são executados inteiramente no seu navegador. Pré-visualizações e conversões nunca carregam seus estilos.
Common use cases
- Use o CSS Clip Path Generator sempre que precisar: Crie polígonos e molde caminhos de clipe com uma visualização interativa.
Troubleshooting
A visualização parece diferente depois de colar
Verifique se há CSS concorrentes em sua página (redefinições, cores herdadas). Copie primeiro a regra gerada em uma folha de estilo isolada.
Perguntas frequentes
Isso carrega meu CSS?
Não. Geradores e conversores são executados em seu navegador com visualização ao vivo.
Eu preciso de uma conta?
Não. Abra a ferramenta, ajuste os controles e copie o CSS.
Ferramentas relacionadas
CSS Triangle Generator
Generate CSS triangles with border tricks — direction, size, and color.
Open toolBorder Radius Generator
Control each corner independently and preview rounded shapes with copy-ready CSS.
Open toolCSS Gradient Generator
Build linear, radial, and conic gradients with live preview and copy-ready CSS.
Open tool