chevron_right

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

Создавайте CSS clip-path фигуры с живым предпросмотром.

Фигура

CircleEllipseInsetTriangleHexagonDiamondPentagonStarArrow

Параметры

Radius: 50

Center X: 50

Center Y: 50

Сгенерированный CSS

clip-path: circle(50% at 50% 50%);

Похожие инструменты

Генератор CSS Keyframes

Создавайте пользовательские CSS keyframes визуально, с живым предпросмотром и готовым кодом для копирования.

Генератор CSS Grid

Создавайте адаптивные CSS Grid-макеты с живым предпросмотром и готовым кодом.

Генератор CSS-анимаций

Создавайте переиспользуемые CSS-анимации с живым предпросмотром движения и готовыми keyframes.

Генератор Box Shadow

Создавайте CSS-тени визуально с живым предпросмотром.

Форматировщик длительности

Преобразуйте секунды, миллисекунды, минуты или часы в читаемую длительность.

Кодировщик URL

Кодирует URL для безопасной передачи.

apps

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

Просмотрите нашу полную коллекцию бесплатных онлайн-инструментов.

Формируйте силуэт элементов визуально, а не расставляя точки вручную

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

Когда это особенно полезно

Он хорошо подходит для масок изображений, нестандартных карточек и декоративных краев секций. Перед использованием стоит проверить, как форма ведет себя с текстом, изображениями и на разных размерах экрана.