Trình tạo tam giác CSS

Tạo hình tam giác CSS bằng thủ thuật viền cổ điển. Đặt hướng, kích thước và màu sắc, sau đó sao chép đoạn mã.

CSS Triangle Generator

Live

Direction

Size60px

Color

CSS output

width: 0;
height: 0;
border-left: 60px solid transparent;
border-right: 60px solid transparent;
border-bottom: 60px solid #e11d48;

Tạo các hình tam giác CSS bằng các thủ thuật viền - hướng, kích thước và màu sắc.
Chạy trong trình duyệt của bạn
Miễn phí sử dụng

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 Triangle Generator bất cứ khi nào bạn cần: Tạo các hình tam giác CSS bằng các thủ thuật về đường viền — hướng, kích thước và màu sắ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.

Build polygon and shape clip-paths with an interactive preview.

Control each corner independently and preview rounded shapes with copy-ready CSS.

Design layered box-shadows with offset, blur, spread, and color — live preview included.