Skip to main content
DevTools24

Генератор CSS Clip Path

Визуальное создание фигур CSS clip-path. Выбор из полигонов, кругов, эллипсов и inset-фигур с пресетами.

1%%
2%%
3%%
clip-path: polygon(50% 0%, 100% 100%, 0% 100%);

CSS clip-path Property - Технические детали

The clip-path CSS property creates a clipping region that sets what part of an element should be shown. Parts inside the region are shown, while those outside are hidden. Use shapes like polygon, circle, ellipse, or inset to create unique visual effects.

Альтернатива командной строки

.element {\n  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);\n}

Справка

Посмотреть официальную спецификацию