Zor durumlar, ele alınmış. Şunlar için pratik bloklar shadcn/ui

Yapay zekâyla inşa edilen ürünler için üretim blokları: akan, yeniden deneyen ve bir araç çalışmadan önce soran sohbetten çevresindeki ekranlara kadar. 65 ücretsiz, açık kaynaklı bileşen üzerine kurulu ve ajanınızın shadcn CLI ile kurması için hazır.

Canlı önizlemeler

Hakkında

HextaUI, shadcn/ui ve Base UI üzerine kurulu bir React bileşenleri koleksiyonudur. Düğmelerden ve formlardan menülere, tablolara ve sohbete kadar bir arayüzün gündelik parçalarını kapsar ve onları sahip olduğunuz kaynak olarak sunar.

Her bileşen genellikle atlanan kısımlar için inşa edilir: yükleme, hata ve boş durumlar, yarıda kesilebilen hareket, klavye yolları, ekran okuyucunun ne duyurduğu ve 320 pikselde ya da sağdan sola bir dilde hâlâ dayanan bir düzen.

Hareket tek bir easing eğrisi ve süre kümesinde çalışır, azaltılmış hareket ayarına saygı gösterir ve yarıda kesilip tersine çevrilebilir. Odak halkaları çevreledikleri şeklin biçimini izler ve her etkileşimli parça yalnızca klavyeyle çalışır.

Görünüm bilerek sakin kalır: nötr yüzeyler, ince kenarlıklar, gölgeler yalnızca sayfanın üzerinde yüzen şeylerde ve bir şekil diğerinin içindeyken eş merkezli kalan köşeler. Markanız bizim değil, sizin tema token'larınız üzerinden yansır.

Bileşenler tek tek yeniden inşa edilir ve yalnızca her durum çalıştığında yayımlanır. Her birinin bu durumları canlı gösteren bir doküman sayfası vardır; böylece bir şey kurmadan önce uç durumları deneyebilirsiniz.

Dokümanlar insanlar ve ajanlar için birlikte yazılmıştır. Her sayfa ayrıca Markdown olarak yayımlanır ve llms.txt tüm kütüphaneyi haritalar; böylece bir yapay zekâ asistanı sizin okuduğunuz API başvurularını ve örnekleri okur.

Kod sizindir. shadcn CLI kaynağı projenize kopyalar; böylece bir paket güncellemesini beklemeden okuyabilir, değiştirebilir ve saklayabilirsiniz. Hepsi GitHub'da açık kaynaktır.

İçinde neler var

Nasıl çalışır

  1. shadcn/ui'ı kurunTailwind CSS v4'lü bir React 19 projesinde shadcn init çalıştırın. Proje zaten shadcn/ui kullanıyorsa ileri atlayın.
  2. Bir bileşen ekleyinRegistry URL'sini shadcn CLI'a verin. Kaynak, bağımlılıkları, tema token'ları ve üzerine kurulduğu HextaUI bileşenleri projenize iner.
  3. Kendinize göre uyarlayınDiğer shadcn/ui bileşenleri gibi @/components/ui yolundan içe aktarın, ardından işaretlemeyi, hareketi veya stilleri değiştirin. Hiçbir şey bir paketin içinde kilitli değildir.
  4. Güncel kalınBileşenler GitHub'da açıkça gelişir. Biri değiştiğinde aynı ekleme komutunu --overwrite ile çalıştırın ve saklamadan önce farkı git'te inceleyin.
  5. Ajanınızı getirinClaude Code'u, Cursor'ı veya herhangi bir MCP istemcisini https://hextaui.com/mcp adresine yöneltin; sizinle kod yazarken prop'lara ve örneklere bakabilir.

HextaUI Pro

Pro, aynı bileşenlerden inşa edilmiş, büyümekte olan eksiksiz bir blok kümesidir: sohbet konuşması, akan metin, araç çağrıları, ajan yapılacaklar listeleri, diff'li bir kod bloğu, ses modu ve daha fazlası. Bunlar bir yapay zekâ ürününün ilk günden ihtiyaç duyduğu, durumları ve hareketi zaten çözülmüş ekranlardır; çevresindeki hesap, ayarlar ve gösterge paneli ekranları sırada.

Ücretsiz yapay zekâ kitleri size doğru görünen bir sohbet verir. Pro ise sonrasında olanlarla ilgilidir: bir yanıtı cümlenin ortasında durdurup yeniden denemek, çalışmadan önce bir araç çağrısını onaylamak, mesaj sürümleri arasında geçiş yapmak ve model hâlâ konuşurken zıplamayan bir konuşma. Her blok çalışan bir AI SDK örneğiyle gelir.

Her bloğun herkesin açabileceği canlı bir önizlemesi vardır ve özel bir registry'den aynı shadcn CLI ile kurulur. Pro, 30 Kasım 2026'ya kadar tek geliştirici için bir kez 49$ veya 10 kişilik bir ekip için 149$'dır. Sonrasında Solo 79$, Team 249$'dır; sınırsız kişisel ve ticari proje için. Planları karşılaştırın veya Prompt Input'u ücretsiz kurun.

Bu sayfanın en üstündeki dört önizleme canlı çalışan Pro bloklarıdır. Thinking, bir modelin akıl yürütmesini ve araç adımlarını geldikçe gösterir. Prompt input model ve efor seçimlerini, dikteyi, bahsetmeleri, komutları ve dosya yüklemelerini ele alır. Chat thread tam bir konuşmayı işler, Voice mode ise onu tarayıcının sesi veya bir gerçek zamanlı ses API'si üzerinden sesli bir konuşmaya dönüştürür.

Solo bir geliştiriciyi kapsar. Team hesabınızdan e-postayla yönetilen 10 kişiye kadar kapsar ve CI'da paylaşılan tek bir token'a izin verir. Yalnızca bitmiş ürünü kullanan müşterilerin ve meslektaşların koltuğa ihtiyacı yoktur. Size uygun değilse 30 gün içinde soru sorulmadan tam iade alırsınız.

Sormadan önce