Figma tasarım sistemlerini WCAG kontrolleri, bileşen puanlaması ve isteğe bağlı kod senkronizasyonu ile denetleyen ve oluşturan bir Claude becerisi.
work-with-design-systems, kurulum öncesi dokümantasyonu kontrol edilmesi gereken ve güven sinyalleri güçlü bir araç. En iyi sonuç için uyumlu agent ve kullanım senaryosu eşleşmesini kontrol et.
npx skills add natdexterra/work-with-design-systemsKomutu terminalde çalıştır.
Skill dosyalarının agent çalışma alanına eklendiğini kontrol et.
Kullanacağın agent içinde skill'i çağırmadan önce README'deki gereksinimleri doğrula.
Repository başlangıç yönlendirmesi
Güven sinyalleri güçlü; yine de production kullanımından önce README ve izinleri kontrol et.
Son commit yaklaşık 106 gün önce.
45 GitHub yıldızı topluluk ilgisini gösteriyor.
0 açık issue bakım yükü hakkında sinyal verir.
MIT lisansı görünüyor.
3 güvenlik/güven notu kayıtlı.
Kurulum zorluğu 3/5.
UI bileşenleriniz için tasarım sistemi dokümantasyonunu doğrudan AI ajanınızdan oluşturun, Figma veya taşınabilir .md dosyalarına dönüştürün.
Argos, ekiplerin kaliteyi korumasına yardımcı olan, istenmeyen UI değişikliklerini tespit eden açık kaynaklı bir görsel test platformudur.
AI'nin doğrudan Figma tuvaline UI çizmesini ve tasarımları yapılandırılmış veri olarak okumasını sağlayan çift yönlü MCP köprüsü.
Herhangi bir web sitesinin tüm tasarım sistemini tek komutla çıkarın.
Bu araç, Figma tasarım sistemleriyle iki şekilde çalışmanızı sağlar. İlk olarak, mevcut tasarımları erişilebilirlik sorunları, adlandırma problemleri ve eksik durumlar açısından denetleyebilirsiniz. İkinci olarak, bileşenler oluşturabilir veya düzeltebilir, slotlar ekleyebilir ve isteğe bağlı olarak her şeyi CSS tokenları ve AI kuralları olarak kod tabanınıza aktarabilirsiniz. Claude Code, Cursor ve Codex ile çalışır.
work-with-design-systems, Figma tasarım sistemlerini yaşam döngüleri boyunca yönetmek için kapsamlı bir Claude becerisidir. İki ana mod sunar: denetleme (salt okunur) ve oluşturma (yazma). Denetleme modunda, token uyumluluğu, etkileşim durumları, WCAG erişilebilirliği, ayrılmış örnekler, adlandırma kalitesi ve bileşen açıklamalarını kapsayan altı denetim modülü çalıştırır. Her bileşene 0-100 arasında ağırlıklı bir hazırlık puanı verilir. Denetlemeden sonra, herhangi bir değişiklik yapmadan önce kararınızı bekler. Oluşturma modunda, bileşenler oluşturmak veya düzeltmek, değişken bağlamaları ve slotlar eklemek ve yapılandırılmış açıklamalar oluşturmak için altı aşamalı bir iş akışı (6. Aşama isteğe bağlı) izler. 6. Aşama, isteğe bağlı olarak, üç katmanlı dolaylı tokens.css, Claude Code/Cursor/Codex için bir AI kuralları dosyası ve CI hazır bir denetim betiği üreterek koda senkronize eder. Beceri, üç dışa aktarma biçimini destekler: markdown, JSON ve kod oluşturma için AI istemi. Ayrıca, Figma'da kompozisyonu belgelemek için bir desen kılavuzu ve Storybook mevcut olduğunda isteğe bağlı hikaye-varyant eşlik kontrolü içerir. Tasarım mühendisleri, ön uç geliştiriciler ve tasarım sistemi bakımcıları için tasarlanmıştır.
45
Yıldız
4
Fork
0
Açık Sorun
MIT
Lisans
Figma tasarım sistemlerini WCAG kontrolleri, bileşen puanlaması ve isteğe bağlı kod senkronizasyonu ile denetleyen ve oluşturan bir Claude becerisi.
Figma ve kod arasında köprü kuran tasarım mühendisleri, Tasarım sistemlerini tüketen ön uç geliştiriciler, Tutarlılığı sağlayan tasarım sistemi bakımcıları
Kurulum bölümü repository düzeyinde başlangıç yönlendirmesi sunar; bağımsız bir kurulum testi garantisi değildir. Resmi README ve sürüm notlarını kontrol edin.
Oluşturma modu Figma dosyalarına yazar; önce yedek alın veya bir test dosyası kullanın. 6. Aşama kod tabanınızda dosyalar oluşturur; oluşturulan tokenları ve kuralları göndermeden önce inceleyin.
Değerlendirilebilecek benzer veya tamamlayıcı araçlar: uSpec, Argos, figma-ui-mcp.
20 Ağu 2026