Mükemmel Geliştirici Araç Seti Web Tasarımı ve Geliştirme İçin

Doğrudan tarayıcınızda web sayfalarını incelemek, ölçmek, yakalamak, analiz etmek ve tasarlamak için 64'dan fazla güçlü araç.

Hepsi Sık Kullanılanlar İncele Yakala Ölç index.popup_tab_analyse
CSS Inspector
Animasyon İnceleyici
Tailwind Olarak Kopyala
Sadece Anahat Modu
Tailwind Yardımcısı
Sayfa Anahattı
Bileşen Dedektörü
Öğeyi Taşı
Öğeyi Sil/Gizle
Öğeyi Dışa Aktar
Bileşeni Kopyala
Ekran Görüntüsü
Görüntüleri Ayıkla
SVG Yakalayıcı
Görüntüyü Değiştir
QR Kod Oluşturucu
Nasıl başlanır

Birkaç tıklamayla DevSuite Pro'yu kullanmaya başlayın

Başlamak basittir. Uzantıyı yükleyin, herhangi bir web sayfasını açın ve pop-up'tan veya yüzen panelden 64'dan fazla geliştirici aracına erişin. Yapılandırma gerekmez.

Uzantıyı Chrome'a ekleyin

  1. Chrome Web Mağazası'nı açın ve "DevSuite Pro" uzantısını arayın.
  2. "Chrome'a Ekle"ye tıklayın ve ardından açılır pencerede "Uzantı ekle"ye tıklayarak onaylayın.

Herhangi bir web sayfasını açın ve bir araç başlatın

  1. Herhangi bir web sitesine gidin, ardından araç çubuğundaki DevSuite Pro simgesine tıklayın veya sayfadaki yüzen paneli kullanın.
  2. Izgaradan herhangi bir aracı seçin. CSS Inspector, Cetveller veya Renk Seçici gibi araçlar mevcut sayfada anında etkinleşir.
Uzantı Özellikleri

DevSuite Pro'nun Temel Özellikleri

DevSuite Pro, web sayfası inceleme, ölçme, tasarım ve analiz için 64'dan fazla geliştirici aracı sunar. Doğrudan tarayıcınıza yerleştirilmiş güçlü özelliklerle iş akışınızı hızlandırın.

CSS Inspector

Herhangi bir öğenin üzerine gelerek CSS stillerini anında görün ve canlı olarak düzenleyin; böylece tasarımları gerçek zamanlı olarak hata ayıklamak ve ayarlamak kolaylaşır.

Daha fazla bilgi →

Öğe İnceleyici

Özelliklerini, boyutlarını, boşluklarını, yazı tiplerini ve renklerini incelemek için herhangi bir öğeye tıklayın. Tarayıcının DevTools'unu açmadan sayfa yapısını anında anlayın.

Daha fazla bilgi →

Cetveller ve Kılavuzlar

Mesafeleri ölçün, hizalamayı kontrol edin ve tasarımlarınızın mükemmel şekilde hizalandığından emin olmak için herhangi bir web sayfasına piksel hassasiyetinde cetveller ve kılavuzlar ekleyin.

Daha fazla bilgi →

Renk Seçici (Color Picker)

Sayfadaki herhangi bir öğeden renkleri seçin ve HEX, RGB veya HSL değerlerini tek bir tıklamayla panonuza kopyalayın.

Daha fazla bilgi →

Ekran Görüntüsü Yakala

Herhangi bir web sayfasında tüm sayfanın veya görünen alanın ekran görüntülerini alın ve anında indirin; tasarım paylaşmak ve hataları bildirmek için idealdir.

Daha fazla bilgi →

Duyarlı Test Cihazı

Tarayıcıdan ayrılmadan duyarlı tasarımı test etmek için bir web sayfasını farklı ekran boyutlarında ve cihaz çözünürlüklerinde önizleyin.

Daha fazla bilgi →
Daha fazla aracı detaylıca keşfedin:
CSS Denetçisi ÜCRETSİZ

CSS Stillerini Gerçek Zamanlı İnceleyin ve Düzenleyin

CSS Animasyonlarını Gerçek Zamanlı Ayıklayın ve Kontrol Edin

Herhangi Bir Öğenin CSS'ini Tailwind Utility Sınıflarına Dönüştürün

Herhangi Bir Sayfanın Tam Düzen Yapısını Görselleştirin

Herhangi Bir Öğe için Kategorize Edilmiş Tailwind Sınıfları Alın

Herhangi Bir Web Sayfası Üzerinde Görsel HTML Ağaç Görünümü

Herhangi Bir Sitede React, Vue, Angular ve Svelte Bileşenlerini Algıla

Bir Sayfadaki Herhangi Bir Öğeyi Sürükle Bırak ile Yeniden Konumlandır

Öğeyi Sil/Gizle ÜCRETSİZ

Herhangi Bir Öğenin Görünürlüğünü Kaldırın veya Değiştirin

Herhangi Bir Öğeyi HTML, CSS veya JSON Olarak Dışa Aktarın

Herhangi Bir Öğeden React, Vue ve Svelte Bileşenleri Oluşturun

Ekran Görüntüsü ÜCRETSİZ

Görünür Alan veya Tam Sayfa Ekran Görüntülerini Yakalayın

Resimleri Çıkar ÜCRETSİZ

Herhangi Bir Web Sayfasındaki Tüm Resimleri Görüntüleyin, Seçin ve İndirin

Herhangi Bir Sayfadaki Her SVG'yi Bulun, Önizleyin ve İndirin

Sayfadaki Herhangi Bir Resmi Kendi Resminizle Değiştirin

QR Kod Oluşturucu ÜCRETSİZ

Herhangi Bir URL veya Metin için Anında QR Kodları Oluşturun

Sayfa Cetveli ÜCRETSİZ

Herhangi Bir Sayfada Piksel Mükemmel Cetveller, Kılavuzlar ve Ölçümler

Birden Fazla Cihaz Görüntü Alanını Aynı Anda Önizleyin

Mesafeyi Ölç ÜCRETSİZ

Herhangi İki Öğe Arasındaki Tam Piksel Mesafelerini Ölçün

Her Yığınlama Bağlamını ve Z-Index Katmanını Görselleştirin

Görsel Kaplamalarla CSS Grid ve Flexbox Düzenlerini İnceleyin

Herhangi Bir Sayfada Kullanıcı Dikkat Sıcak Noktalarını Simüle Edin

Önbelleği, Çerezleri, localStorage ve sessionStorage'ı Seçici Temizleyin

Herhangi Bir Web Sitesinin Arkasındaki Her Teknolojiyi Algılayın

SEO Denetçisi ÜCRETSİZ

Kapsamlı SEO Denetimi: Meta Etiketler, Başlıklar, OpenGraph ve Daha Fazlası

Otomatik WCAG Denetimi: Kontrast, Alt Metin, ARIA ve Daha Fazlası

Herhangi Bir Sayfadaki Herhangi Bir Metne Anında Düzenlemek için Tıklayın

Google Fonts'tan Herhangi Bir Yazı Tipini Global veya Öğe Başına Değiştirin

Herhangi Bir Web Sayfasında Kullanılan Her Yazı Tipini Keşfedin

Renk Seçici ÜCRETSİZ

HEX, RGB ve HSL Renk Değerleri için Hassas Damlalık

Renk Paleti ÜCRETSİZ

Herhangi Bir Web Sayfasından Tam Renk Paletini Çıkarın

Herhangi Bir Web Sitesine Anında Karanlık Mod Uygulayın

Sekme Başına JavaScript'i Anında Etkinleştirin veya Devre Dışı Bırakın

Çerez Düzenleyici ÜCRETSİZ

Herhangi Bir Alan için Çerezleri Görüntüleyin, Düzenleyin, Ekleyin ve Silin

Konsol Kaydedici ÜCRETSİZ

DevTools Olmadan Konsol Çıktısını Yüzen Bir Panelde Görüntüleyin

Tüm Ağ İsteklerini Gerçek Zamanlı İzleyin

localStorage ve sessionStorage'ı Görüntüleyin, Düzenleyin, Ekleyin ve Silin

Bir Sayfadaki Her Bağlantıyı Tarayın ve Bozuk Olanları Bulun

Sayfa Performansı ÜCRETSİZ

Anında Performans Paneli: Yükleme Süresi, DOM İstatistikleri ve Kaynaklar

JSON'u Tek Tıkla Biçimlendirin, Küçültün ve Doğrulayın

Dizeleri Anında Base64'e Kodlayın ve Base64'ten Çözün

URL Dizelerini Tek Tıkla Kodlayın ve Çözün

HTML Varlıklarını Anında Kodlayın ve Çözün

Kodlar İçin Karakter Kaçırma ve Geri Döndürme

64 Resim ↔ Base64 ÜCRETSİZ

Resimleri Base64 Veri URI'lerine Dönüştürün

JSON Web Token'ları Anında Çözümleyin

UUID Oluşturucu ÜCRETSİZ

Toplu UUID v4 Tanımlayıcıları Oluşturun

Hash Oluşturucu ÜCRETSİZ

MD5, SHA-1, SHA-256, SHA-384, SHA-512 Hash'leri Hesaplayın

Parola Oluşturucu ÜCRETSİZ

Kriptografik Olarak Güçlü Parolalar Oluşturun

Regex Test Edici ÜCRETSİZ

Eşleşme Vurgulama ile Düzenli İfadeleri Canlı Test Edin

Unix, ISO ve Okunabilir Tarihleri Dönüştürün

İki Metin Bloğunu Satır Satır Karşılaştırın

Kontrast Kontrolü ÜCRETSİZ

Herhangi İki Renk Arasındaki WCAG Kontrast Oranını Kontrol Edin

HEX, RGB, HSL, HSV ve OKLCH Formatlarını Anında Dönüştürün

Herhangi Bir Görüntüden Baskın Paleti Çıkarın

Herhangi Bir Öğe İçin CSS Seçicileri ve XPath Alın

CORS Kontrolü ÜCRETSİZ

Kaynaklar Arası İstekleri Test Edin ve CORS Başlıklarını İnceleyin

WebSocket Çerçevelerini Gerçek Zamanlı Yakalayın

Sayfadaki Kırık Görselleri Anında Tarayın

Formları Gerçekçi Test Verileriyle Otomatik Doldurun

CSV ve JSON Arasında Çift Yönlü Dönüşüm Yapın

XML Formatlayıcı ÜCRETSİZ

Söz Dizimi Vurgulama ile XML Formatlayın, Doğrulayın ve Görüntüleyin

SQL Formatlayıcı ÜCRETSİZ

SQL Sorgularını Güzelleştirin ve Formatlayın

PDF'e Dönüştür ÜCRETSİZ

Web Sayfalarını Temiz PDF'ler Olarak Kaydedin

Fiyatlandırma ve Planlar

Basit ve Şeffaf Fiyatlandırma

İş akışınız için en iyi planı seçin. Ücretsiz başlayın, istediğiniz zaman yükseltin.

Temel

DevSuite Pro'yu denemek için mükemmel. Kredi kartı gerekmez.

$0

Sonsuza Kadar Ücretsiz
Ücretsiz Başla
  • 20 Ücretsiz Geliştirici Aracı
  • CSS Inspector ve Renk Seçici
  • Ekran Görüntüsü Yakalama
  • Yüzen Panel Arayüzü
  • Tüm Gelecekteki Ücretsiz Güncellemeler

Aylık En Popüler

Tüm 64+ profesyonel araca tam erişim. Aylık faturalandırılır.

$2.99

aylık
Aylık Planı Başlat
  • Tüm 64+ Geliştirici Aracı
  • Pro Araçlara Tam Erişim
  • 3 cihaza kadar
  • Öncelikli Destek
  • İstediğiniz zaman iptal edin

Tek Seferlik En İyi Değer

Bir kez ödeyin, sonsuza kadar kullanın. Herhangi bir abonelik ücreti olmadan 64+ pro aracın tamamına tam erişim.

$29.99

tek seferlik ödeme
Bir Kez Al, Sonsuza Kadar Kullan
  • Tüm 64+ Geliştirici Aracı
  • Pro Araçlara Tam Erişim
  • 3 cihaza kadar
  • Öncelikli Destek
  • Abonelik ücreti yok
DevSuite Pro FAQ section background
SSS

DevSuite Pro Kullanıcılarından Sıkça Sorulan Sorular

DevSuite Pro uzantısının özellikleri ve kullanımı hakkında yaygın sorular. Bir sorunuz varsa, cevabı aşağıda olabilir.

DevSuite Pro'yu nasıl yüklerim?

Chrome Web Mağazası'nı ziyaret edin, "DevSuite Pro"yu arayın, "Chrome'a Ekle"ye tıklayın ve "Uzantı Ekle"yi seçerek onaylayın. Yüklendikten sonra uzantı simgesi tarayıcınızın araç çubuğunda görünecektir. 64'dan fazla geliştirici aracına anında erişmek için simgeye tıklayın.

Ücretsiz ve Pro araçlar arasındaki fark nedir?

Ücretsiz araçlar (20+) lisans olmaksızın herkes tarafından kullanılabilir. Pro araçlar altın renkli bir PRO rozetine sahiptir ve kullanılabilmesi için etkin bir Pro lisansı gerektirir. Açılır pencerede hangi araçların ücretsiz veya pro olduğunu görebilirsiniz; ücretsiz araçlarda kilit simgesi yoktur, pro araçlar ise lisansınızı etkinleştirene kadar biraz sönük görünür.

Araç bazı web sitelerinde neden çalışmıyor?

Bazı web sitelerinde, tarayıcı uzantılarının belirli eylemlerini engelleyen katı İçerik Güvenliği Politikaları (CSP) bulunur. Bu durum özellikle bankacılık ve devlet web sitelerinde yaygındır. Ayrıca, Chrome'un dahili sayfaları (chrome://) uzantıların içerik komut dosyalarını çalıştırmasına izin vermez.

Sayfada yaptığım değişiklikler kalıcı mı?

Hayır. Öğeyi Taşı, Canlı Metin Düzenleyici, Öğeyi Sil/Gizle ve CSS Inspector gibi araçlarla yapılan tüm değişiklikler geçicidir. Sadece o anda tarayıcınızda gördüğünüzü etkilerler. Sayfayı yenilemek her şeyi orijinal durumuna döndürecektir.

Pro lisansımı nasıl etkinleştiririm?

DevSuite Pro pop-up'ını açın, sağ üst köşedeki Ayarlar simgesine tıklayın. Lisans bölümüne inin, lisans anahtarınızı giriş alanına yapıştırın ve Etkinleştir'e tıklayın. Anahtar geçerliyse rozet ÜCRETSİZ'den PRO'ya dönecek ve tüm pro araçların kilidi anında açılacaktır.

Yüzen paneli nasıl taşıyabilirim veya gizleyebilirim?

Ayarlar'a gidip farklı bir kenar çubuğu konumu seçerek (Üst, Alt, Sol veya Sağ) paneli taşıyabilirsiniz. Ayrıca Ayarlar'da "Paneli sayfalarda göster" anahtarını kapatarak veya istediğiniz zaman Ctrl+Shift+X tuşlarına basarak paneli tamamen gizleyebilirsiniz.

DevSuite Pro tarama verilerini topluyor mu?

Hayır. DevSuite Pro tarama verilerinizin hiçbirini toplamaz, izlemez veya iletmez. Tüm ayarlar tarayıcınızda yerel olarak saklanır. Tek dış istek, lisans anahtarınızın sunucumuzda doğrulanması için lisans anahtarı etkinleştirme sırasında yapılır.

DevSuite Pro'yu Firefox'ta kullanabilir miyim?

Evet! DevSuite Pro hem Chrome Web Mağazası'nda hem de Firefox Eklentileri'nde mevcuttur. Chrome, Edge, Brave ve diğer Chromium tabanlı tarayıcıların yanı sıra Firefox'ta da çalışır.