Trình tạo đường dẫn clip CSS

Xây dựng các đường dẫn clip đa giác và hình dạng với bản xem trước tương tác. Tuyệt vời cho hình dạng anh hùng và mặt nạ hình ảnh.

CSS Clip Path Generator

Live

Shape

CSS output

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

Text / on-page input

Bản xem trước nhiều lớp rất phức tạp có thể có cảm giác chậm hơn trên điện thoại cũ.

Trình tạo màu & CSS chạy hoàn toàn trong trình duyệt của bạn. Bản xem trước và chuyển đổi không bao giờ tải lên kiểu của bạn.

Sử dụng CSS Clip Path Generator bất cứ khi nào bạn cần: Xây dựng các đường dẫn clip đa giác và hình dạng bằng bản xem trước tương tác.

Kiểm tra CSS cạnh tranh trên trang của bạn (đặt lại, màu kế thừa). Trước tiên hãy sao chép quy tắc đã tạo vào biểu định kiểu riêng biệt.

Không. Trình tạo và bộ chuyển đổi chạy trong trình duyệt của bạn với bản xem trước trực tiếp.

Không. Mở công cụ, điều chỉnh các điều khiển và sao chép CSS.