İçeriğe geç
English

Wind 1.12.0 yayında

Modern Flutter uygulamalarını widget ağacından hiç çıkmadan hızla geliştirin.

Flutter için Tailwind CSS. flex, p-4, dark:bg-gray-800, hover:scale-105 ve md:flex-row gibi sınıflarla dolu, yardımcı sınıf odaklı bir stil çatısı; bunlar responsive ve temaya duyarlı widget ağaçlarına dönüşür.

wind_kit / lib / welcome_card.dart
hot reload

Stille. Birleştir. Yayınla.

Stil için widget'ları iç içe geçirmeyi bırakın. Dart kodunuza doğrudan className="p-4 bg-blue-500 hover:bg-blue-700" yazın. Web'de yazdığınız aynı Tailwind sözdizimi.

  • Yardımcı Sınıf Odaklı Stil

    Widget'ları p-4 bg-blue-500 rounded-lg gibi birleştirilebilir sınıflarla stilleyin. Sadece stil için derin iç içe widget ağaçlarına gerek kalmaz.

    Daha fazla Yardımcı Sınıf Odaklı Stil hakkında
  • Responsive Tasarım

    Mobil öncelikli kırılma noktası sistemi. Belirli ekran boyutlarında stil uygulamak için herhangi bir sınıfın önüne sm:, md: veya lg: koyun.

    Daha fazla Responsive Tasarım hakkında
  • Etkileşim Durumları

    Herhangi bir öğeye hover:bg-blue-700 veya disabled:opacity-50 ekleyin. Hover, focus, yükleniyor ve özel durum desteği hazır gelir.

    Daha fazla Etkileşim Durumları hakkında
  • Tema

    Tüm tasarım sisteminizi WindThemeData içinde tanımlayın: özel renkler, tipografi ölçekleri, boşluk değerleri ve gölgeler. Tek yapılandırma, her yerde tutarlı arayüz.

    Daha fazla Tema hakkında
  • Karanlık Mod

    Otomatik karanlık mod için herhangi bir sınıfın önüne dark: koyun. dark:bg-slate-900 kullanın ve temayı çalışma anında tek çağrıyla değiştirin.

    Daha fazla Karanlık Mod hakkında
  • Dinamik Render

    WDynamic ile Flutter arayüzlerini çalışma anında JSON'dan kurun. CMS düzenleri, A/B testleri ve uzaktan yapılandırma için sunucu güdümlü arayüz. Uygulamayı yeniden derlemek gerekmez.

    Daha fazla Dinamik Render hakkında

Canlı Playground

Wind kodunu yazın, sonucu anında görün. Yardımcı sınıfları deneyin, fikirlerinizi sınayın ve kodu doğrudan Flutter projenize kopyalayın.

  • Yazarken gerçek zamanlı önizleme
  • Tek tıkla panoya kopyalama
  • Tüm yardımcı sınıflar desteklenir
Playground'u açın
playground
Canlı senkron açık

Ajanınız Wind konuşuyor.

Wind UI becerisi, kodlama asistanınıza ilk satırdan önce className dilbilgisini, karanlık mod eşleştirme kurallarını ve kaçınılacak kalıpları öğretir. Tek komut kurulumu tamamlar.

npx skills add anilcancakir/ai --skill wind-ui

projenizde çalıştırın diğer editörler

şunlarla çalışır

  • Claude Code
  • Cursor
  • OpenCode
  • VS Code Copilot
  • Codex CLI

Ve yazdığını doğrular.

Beceriler dilbilgisini öğretir. mcp.anilcancakir.com/wind adresindeki MCP sunucusu, ajanınıza düzenleme sırasında canlı doküman araması sağlar; böylece uydurma bir className göndermez.

  • Streamable HTTP

    Tek uç nokta, her istemci.

  • search-docs

    Kaynağa canlı sorgu.

  • Herkese açık

    MIT, sonsuza dek ücretsiz.

Editörünüzü bağlayın
mcp.anilcancakir.com/wind canlı

# streamable http, varsayılan

claude mcp add --transport http wind_kit https://mcp.anilcancakir.com/wind

# veya stdio, http desteklemeyen istemciler için

npx @anilcancakir/wind-mcp

Herkese açık, kimlik doğrulamasız, MIT.

Geliştiriciler seviyor

“Wind, Flutter'da arayüz kurma biçimimizi tamamen değiştirdi. Web geliştirme gibi ama yerel. Hız kazancı inanılmaz.”
Sarah Chen TechFlow, Kıdemli Flutter Mühendisi
“Sonunda Flutter için mantıklı bir stil çözümü! Yardımcı sınıf odaklı yaklaşım bize her hafta saatler süren şablon kodundan kurtarıyor.”
Marcus Rodriguez AppForge, Baş Geliştirici
“React Native'den geçiş Wind ile sorunsuz oldu. Tanıdık Tailwind sözdizimi ekibimizi ilk günden verimli kıldı.”
Emily Watson StartupX, Mobil Mimar
“Karanlık mod desteği harika. Tek bir önek ve tüm uygulamamız dönüşüyor. Wind tam bir oyun değiştirici.”
James Park DesignLab, UI/UX Geliştirici
“MVP'mizi Wind ile 3 kat hızlı yayınladık. Bileşen kalıpları doğal geliyor ve doküman birinci sınıf.”
Aisha Patel MobileFirst, CTO

Saniyeler içinde geliştirmeye başlayın

~/my_app
flutter pub add wind_kit

Ya da pubspec.yaml dosyasına ekleyin:

dependencies:
  wind_kit: ^1.12.0

Ya da yapay zeka ajanınıza şu istemi verin:

https://anilcancakir.com/wind_kit/docs/llms.txt adresini oku ve Wind paketini bu projeye kur.