merhaba sizlere kendim için yaptığım renk düzenleme web uygulamasını sizinle'de paylaşmak istedim. . açık kaynak olarak github linki veriyorum sizlerde projelerinizde kullanabilrsiniz.
















github linki




🎨 Modern Renk Seçici





Profesyonel renk seçimi ve yönetimi için gelişmiş araçlar


ÖzelliklerKullanım KılavuzuRenk SeçiciRenk PaletleriGradient OluşturucuVeri YönetimiKısayollarSSS

🌟 Özellikler

Modern Renk Seçici, tasarımcılar, geliştiriciler ve renk tutkunları için geliştirilmiş kapsamlı bir renk yönetim aracıdır. Aşağıdaki özellikleri sunar:
  • 🎯 Gelişmiş Renk Seçici: HEX, RGB, HSL ve CMYK formatlarında renk seçimi
  • 📊 Renk Bilgileri: Kontrast oranı ve parlaklık değerleri
  • 🖼️ Görselden Renk Seçme: Yüklenen görsellerden piksel bazlı renk seçimi
  • 📝 Renk Geçmişi: Seçilen renklerin otomatik kaydedilmesi
  • Popüler Renkler: Sık kullanılan renkleri kaydetme ve hızlı erişim
  • 🎨 Renk Paletleri: Renk gruplarını palet olarak kaydetme ve yönetme
  • 🌈 Gradient Oluşturucu: Renk paletlerinden gradient oluşturma
  • 📚 Gradient Kataloğu: Oluşturulan gradientleri kaydetme ve yönetme
  • 📥 Veri İçe/Dışa Aktarma: Renk paletleri ve gradientleri JSON formatında içe/dışa aktarma
  • 📱 Responsive Tasarım: Mobil ve masaüstü cihazlarda sorunsuz çalışma
  • 🖱️ Sağ Tık Menüsü: Renk kutuları için özel sağ tık menüsü
📖 Kullanım Kılavuzu

🎨 Renk Seçici


Renk Seçici, uygulamanın temel özelliğidir. Renk seçmek için aşağıdaki adımları izleyin:
  1. Renk Seçme:
    • Renk seçiciyi kullanarak istediğiniz rengi seçin
    • Veya görselden renk seçme özelliğini kullanarak bir görselden renk seçin
  2. Renk Formatı:
    • Açılır menüden renk formatını seçin (HEX, RGB, HSL, CMYK)
    • Seçilen renk otomatik olarak seçilen formatta görüntülenir
  3. Renk Değeri:
    • Renk değeri otomatik olarak güncellenir
    • Kopyala butonuna tıklayarak renk değerini panoya kopyalayabilirsiniz
  4. Renk Önizleme:
    • Seçilen rengin önizlemesi anında görüntülenir
    • Renk bilgileri (kontrast oranı ve parlaklık) otomatik olarak hesaplanır
  5. Renk Kaydetme:
    • "Kaydet" butonuna tıklayarak rengi geçmişe ekleyebilirsiniz
    • "Sıfırla" butonuna tıklayarak renk geçmişini temizleyebilirsiniz

🎨 Renk Paletleri


Renk paletleri, renk gruplarını kaydetmenizi ve yönetmenizi sağlar:
  1. Palet Oluşturma:
    • İstediğiniz renkleri seçin ve "Kaydet" butonuna tıklayın
    • "Palet Kaydet" butonuna tıklayın
    • Palet için bir isim girin
    • Palet otomatik olarak kaydedilir ve listelenir
  2. Palet Kullanma:
    • Kaydedilen paletler "Renk Paletleri" bölümünde listelenir
    • Palet üzerindeki fırça ikonuna tıklayarak paleti gradient oluşturucuda kullanabilirsiniz
    • Palet üzerindeki çöp kutusu ikonuna tıklayarak paleti silebilirsiniz
  3. Palet Yönetimi:
    • Paletleri JSON formatında dışa aktarabilirsiniz
    • Dışa aktarılan paletleri içe aktarabilirsiniz
    • "Her Şeyi Sıfırla" butonuna tıklayarak tüm paletleri silebilirsiniz

🌈 Gradient Oluşturucu


Gradient oluşturucu, renk paletlerinden gradient oluşturmanızı sağlar:
  1. Gradient Oluşturma:
    • Açılır menüden bir renk paleti seçin
    • "Gradient Oluştur" butonuna tıklayın
    • Gradient açısını ayarlamak için kaydırıcıyı kullanın
  2. Gradient Kaydetme:
    • "Gradient Kaydet" butonuna tıklayın
    • Gradient için bir isim girin
    • Gradient otomatik olarak kaydedilir ve katalogda listelenir
  3. Gradient Kullanma:
    • Kaydedilen gradientler "Gradient Kataloğu" bölümünde listelenir
    • Gradient üzerindeki fırça ikonuna tıklayarak gradienti kullanabilirsiniz
    • Gradient üzerindeki kalem ikonuna tıklayarak gradient ismini değiştirebilirsiniz
    • Gradient üzerindeki çöp kutusu ikonuna tıklayarak gradienti silebilirsiniz
  4. Gradient Kopyalama:
    • "Kopyala" butonuna tıklayarak gradient CSS kodunu panoya kopyalayabilirsiniz

📊 Veri Yönetimi


Modern Renk Seçici, verilerinizi yönetmeniz için çeşitli araçlar sunar:
  1. Veri İçe Aktarma:
    • Navbar'daki "İçe Aktar" butonuna tıklayın
    • Açılan menüden içe aktarmak istediğiniz veri türünü seçin:
      • Renk Paletleri: Sadece renk paletlerini içe aktarır
      • Gradientler: Sadece gradientleri içe aktarır
      • Tüm Veriler: Tüm verileri (renk geçmişi, paletler, popüler renkler, gradientler ve renk isimleri) içe aktarır
    • JSON dosyasını seçin
    • Veriler otomatik olarak içe aktarılır ve arayüz güncellenir
  2. Veri Dışa Aktarma:
    • Navbar'daki "Dışa Aktar" butonuna tıklayın
    • Açılan menüden dışa aktarmak istediğiniz veri türünü seçin:
      • Renk Paletleri: Sadece renk paletlerini dışa aktarır
      • Gradientler: Sadece gradientleri dışa aktarır
      • Tüm Veriler: Tüm verileri (renk geçmişi, paletler, popüler renkler, gradientler ve renk isimleri) dışa aktarır
    • JSON dosyası otomatik olarak indirilir
  3. Veri Sıfırlama:
    • "Her Şeyi Sıfırla" butonuna tıklayın
    • Onay mesajını onaylayın
    • Tüm veriler (renk geçmişi, paletler, popüler renkler, gradientler ve renk isimleri) silinir

🖱️ Sağ Tık Menüsü


Renk kutuları için özel bir sağ tık menüsü sunulur:
  1. Menüyü Açma:
    • Herhangi bir renk kutusuna sağ tıklayın
    • Özel sağ tık menüsü açılır
  2. Menü Seçenekleri:
    • Renk Değerini Kopyala: Renk değerini panoya kopyalar
    • Renk İsmini Değiştir: Renk için özel bir isim belirler
    • Renk İsmini Sil: Renk için belirlenen ismi siler

⌨️ Kısayollar


Modern Renk Seçici, kullanımı kolaylaştırmak için çeşitli kısayollar sunar:
KısayolİşlevCtrl+CRenk değerini kopyalarCtrl+SSeçilen rengi kaydederCtrl+RRenk geçmişini sıfırlarCtrl+Shift+RTüm verileri sıfırlarCtrl+EGradient oluştururCtrl+GGradient kopyalar
❓ Sık Sorulan Sorular

Renk geçmişi nasıl temizlenir?


Renk geçmişini temizlemek için "Sıfırla" butonuna tıklayın ve onay mesajını onaylayın. Tüm renk geçmişi silinecektir.

Renk paletleri nasıl kaydedilir?


Renk paletlerini kaydetmek için:
  1. İstediğiniz renkleri seçin ve "Kaydet" butonuna tıklayın
  2. "Palet Kaydet" butonuna tıklayın
  3. Palet için bir isim girin

Gradientler nasıl kaydedilir?


Gradientleri kaydetmek için:
  1. Bir renk paleti seçin ve gradient oluşturun
  2. "Gradient Kaydet" butonuna tıklayın
  3. Gradient için bir isim girin

Veriler nasıl yedeklenir?


Verileri yedeklemek için:
  1. Navbar'daki "Dışa Aktar" butonuna tıklayın
  2. "Tüm Veriler" seçeneğini seçin
  3. JSON dosyası otomatik olarak indirilir

Veriler nasıl geri yüklenir?


Verileri geri yüklemek için:
  1. Navbar'daki "İçe Aktar" butonuna tıklayın
  2. "Tüm Veriler" seçeneğini seçin
  3. Yedeklediğiniz JSON dosyasını seçin
📝 Lisans

Bu proje MIT lisansı altında lisanslanmıştır. Daha fazla bilgi için LICENSE dosyasına bakın.
👥 Katkıda Bulunma

Katkıda bulunmak isterseniz, lütfen bir pull request gönderin. Büyük değişiklikler için, lütfen önce bir issue açarak neyi değiştirmek istediğinizi tartışın.
📞 İletişim