UTILS.
100% у браузері

Генератор CSS clip-path

Обрізайте елемент у поширені фігури та копіюйте CSS clip-path.

Про цей інструмент

Виберіть фігуру та миттєво обріжте блок попереднього перегляду відповідним правилом clip-path, після чого скопіюйте готовий CSS. Перегляд оновлюється наживо повністю у вашому браузері.

Поширені запитання

Як працюють полігональні clip-path?
Кожна точка — це пара відсотків x y відносно блока; браузер з'єднує їх по порядку та показує лише область усередині контуру.
Чи всі браузери підтримують clip-path?
Фігури polygon, circle, ellipse та inset підтримуються в усіх сучасних браузерах, тож згенерований CSS працює без префіксів.

Більше інструментів