CSS Üçgen Üretici
Sekiz yön (4 ana yön + 4 köşe dik üçgen), bağımsız taban / yükseklik / eğim sliderları, renk ve canvas seçicileri, yaygın kullanım şablonları (tooltip, caret, kurdele, play butonu), tooltip konumlandırma parçası, eğitici 'neden çalışıyor' paneli ve CSS / Tailwind / React stili / SCSS mixin / HTML çıktısı.
Canlı önizleme
Üçgen, kalın renkli kenarlığa sahip 0×0 bir div — SVG ya da clip-path yok.
100px × 80px
Ben bir tooltip'im
Üçgen
Yön seç, boyut, eğim ve renk ayarla.
Yön
100px
80px
50%
Tooltip önizleme
Üçgeni bir örnek kart üzerinde gerçek tooltip oku olarak göster.
Hızlı şablonlar
En çok kullanılan şekiller için tek tıkla hazır reçeteler.
Kod çıktısı
İstediğin formatta tek tıkla kopyala.
CSS
.triangle-up {
width: 0;
height: 0;
border-style: solid;
border-width: 0px 50px 80px 50px;
border-color: transparent transparent #3b82f6 transparent;
}border-width: 0px 50px 80px 50px
border-color: transparent transparent #3b82f6 transparent