UTILS.
100% en el navegador

Generador de clip-path CSS

Recorta un elemento en formas comunes y copia el CSS de clip-path.

Acerca de esta herramienta

Elige una forma y recorta al instante una caja de vista previa con la regla clip-path correspondiente, luego copia el CSS listo para usar. La vista previa se actualiza en vivo, completamente en tu navegador.

Preguntas frecuentes

¿Cómo funcionan los clip-path de polígono?
Cada punto es un par de porcentajes x y relativo a la caja; el navegador los conecta en orden y muestra solo el área dentro del contorno.
¿Todos los navegadores admiten clip-path?
Las formas polígono, círculo, elipse e inset son compatibles con todos los navegadores modernos, así que el CSS generado funciona sin prefijos.

Más herramientas