Herhangi bir siteye bakın.
Tasarım sistemini saniyeler içinde çıkarın.
Renkler, tipografi, boşluk ölçeği, gölgeler ve border-radius — StyleKit tek tıkla çıkarır ve yapılandırılmış bir DESIGN.md dosyası olarak indirir. Figma'da mı çalışıyorsunuz? Companion plugin ile aynı tokenları doğrudan native stil ve variable olarak içe aktarın.
Sadece activeTab + scripting izni · Hesap ya da kredi kartı gerekmez · Arka planda hiçbir şey çalışmaz
Çıkarılan tokenlar
# DESIGN.md
## Colors
--color-primary: #8b5cf6;
--color-accent: #10b981;
## Typography
font-family: Inter;
## Spacing
4px 8px 16px 24px 32px
0
izin: activeTab + scripting
$0
hesap ya da kredi kartı
0
token kategorisi çıkarılır
0%
yerel çalışma, varsayılan
Kimler için
Tasarım sistemleriyle çalışan herkes
UI/UX tasarımcılar
İlham aldığınız ya da rakip bir sitenin tasarım sistemini saniyeler içinde çözümleyin, elle ölçmeyin.
Frontend geliştiriciler
CSS değişkenlerini DevTools'tan tek tek toplamak yerine, hazır bir DESIGN.md ile başlayın.
Ajanslar & prodüksiyon ekipleri
Müşteri sitelerinin marka tutarlılığını, teslimattan önce hızlıca denetleyin.
Figma kullanıcıları
Topluluk galerisinden beğendiğiniz bir sitenin tokenlarını tek tıkla Figma değişkeni olarak alın.
Özellikler
Bir tıkla, tam bir tasarım analizi
DevTools'ta CSS kazımak yerine, StyleKit gördüğünüz sayfanın tasarım DNA'sını yapılandırılmış hale getirir.
Tasarım token çıkarımı
Renk paleti, tipografi, boşluk ölçeği, gölgeler ve border-radius — aktif sekmede tek tıkla, tamamen otomatik.
Minimum izin, maksimum güven
Sadece activeTab ve scripting izni ister; geniş host izni, cookie ya da geçmiş erişimi yok. Sadece o an baktığınız sayfayı okur, arkada hiçbir şey çalışmaz.
DESIGN.md dışa aktarma
Geliştiriciler için okunabilir, yapılandırılmış markdown; repo'ya commit'leyin ya da ekip arkadaşınıza gönderin.
Figma plugin ile içe aktarma
Companion Figma plugin'i ile çıkarılan tokenları yapıştırın, ya da galeriden tek tıkla native stil/variable olarak içe aktarın.
Publish to Gallery (opsiyonel)
Beğendiğiniz bir sitenin tokenlarını topluluk galerisinde paylaşın; kaynak URL ile birlikte görünür, tamamen isteğe bağlı.
Gizlilik
Varsayılan olarak gizlilik öncelikli
Ekstra bir topluluk özelliği isteğe bağlı olarak açık — geri kalan her şey tarayıcınızda kalır.
Yerelde çalışır
- Extraction tamamen tarayıcınızda gerçekleşir, veri sunucuya gönderilmez
- Sadece activeTab + scripting izni — geniş host izni yok
- Cookie, tarama geçmişi ya da diğer sekmelere erişim yok
- Arka planda hiçbir şey çalışmaz, sadece siz tetiklediğinizde çalışır
İsteğe bağlı: Gallery'e yayınlayın
- "Publish to Gallery" butonuna basarsanız o sayfanın tokenları + kaynak URL herkese açık galeride paylaşılır
- Figma plugin'inden bu galeriyi gezip beğendiğiniz herhangi bir sitenin tasarımını içe aktarabilirsiniz
- Yayınlamazsanız hiçbir şey paylaşılmaz — varsayılan davranış tamamen yereldir
Fiyat
Tamamen ücretsiz, hesap gerekmez
Chrome eklentisi ve companion Figma plugin'i, sonsuza kadar ücretsiz.
Free
Chrome eklentisi ve Figma plugin'i, hesap gerekmeden
$0 — sonsuza dek
- Sınırsız token çıkarımı
- Sınırsız DESIGN.md dışa aktarma
- Figma plugin dahil (o da ücretsiz)
- Publish to Gallery ile topluluk galerisine katılım
- Hesap ya da kredi kartı gerekmez
- Chrome Web Store üzerinden otomatik güncelleme
Figma plugin'i ayrıca Figma Community üzerinden ücretsiz indirebilirsiniz: Figma Community'de aç
SSS
Sık sorulanlar
StyleKit gerçekten ücretsiz mi, hesap gerekiyor mu?
Evet, tamamen ücretsiz ve hesap gerekmez. Chrome eklentisini kurup doğrudan kullanmaya başlayabilirsiniz; companion Figma plugin'i de aynı şekilde ücretsizdir.
Chrome eklentisi neden bu kadar az izin istiyor?
StyleKit manifest'inde sadece activeTab ve scripting izinleri tanımlıdır. Geniş host izni, cookie ya da tarama geçmişi erişimi istemez — yalnızca o an aktif olarak baktığınız sayfayı okur, başka hiçbir şeye erişmez.
Verilerim nereye gidiyor?
Extraction işlemi tamamen tarayıcınızda gerçekleşir; hiçbir veri hiçbir sunucuya gönderilmez. Bunun tek istisnası, ayrı ve açıkça isteğe bağlı olan "Publish to Gallery" özelliğidir.
"Publish to Gallery" ne işe yarar, verilerimi paylaşır mı?
Bu butona bastığınızda, o sayfadan çıkarılan tokenlar ve kaynak URL, Figma plugin'inden gezilebilen herkese açık bir topluluk galerisinde paylaşılır. Basmadığınız sürece hiçbir şey paylaşılmaz — varsayılan davranış tamamen yereldir.
Figma plugin'i nasıl kullanılır?
Figma plugin'i topluluk galerisini gezmenizi ve beğendiğiniz herhangi bir sitenin yayınlanmış tokenlarını tek tıkla native Figma stili/variable'ı olarak içe aktarmanızı sağlar. Ayrıca Chrome eklentisiyle kendi çıkardığınız tokenları da doğrudan plugin'e yapıştırabilirsiniz.
DESIGN.md dosyası tam olarak ne içeriyor?
Çıkarılan renk paletini, tipografi ölçeğini, boşluk (spacing) değerlerini, gölgeleri ve border-radius değerlerini yapılandırılmış markdown formatında içerir — geliştiricilerin doğrudan repo'ya ekleyebileceği, okunabilir bir referans dosyasıdır.
Bir sonraki projenizin tasarım sistemini bugün çıkarın
Chrome'a ekleyin, herhangi bir sitede deneyin — hesap ya da kredi kartı gerekmez.
Özellik önerisi ya da iş birliği için yazın
En kısa sürede e-posta ile döneriz.
Instagram: @digitalexpertde