ifBuyz Tools
Desain

Generator Segitiga CSS

Masukan

Pilih arah, lebar dasar, tinggi, dan warna.

Arah
Base Width60px
Tinggi80px

Salin CSS yang dibuat lalu terapkan ke elemen kosong.

Hasil

.triangle {
  width: 0;
  height: 0;
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-bottom: 80px solid #6366f1;
}

Pertanyaan yang sering diajukan

Bagaimana membuat segitiga di CSS?
Dengan teknik border: satu sisi berwarna, lainnya transparan.
Bisakah arah segitiga diubah?
Ya, dengan mengatur sisi border yang terlihat.
Apa keuntungan generator untuk ini?
Menghemat trial-and-error dan memberi kode siap pakai.