Görselden Renk Seçici ve Palet Oluşturucu - Ücretsiz Çevrimiçi Araç

Piksel renklerini yerel olarak seçmek, HEX/RGB/HSL değerlerini kopyalamak ve görselden baskın renk paleti çıkarmak için bir resim yükleyin, sürükleyin veya yapıştırın.

Sinema modu için tıklayın
Görseli buraya sürükleyin veya seçmek için tıklayın

PNG, JPG, WebP, GIF ve BMP desteklenir. Ctrl+V / Cmd+V ile ekran görüntüsü de yapıştırabilirsiniz

Bir görsel seçin veya yapıştırın

Görseller tarayıcınızda yerel olarak işlenir. Yükledikten sonra artı işaretini gezdirin.

Bir görsel seçin veya yapıştırın

Görseller tarayıcınızda yerel olarak işlenir. Yükledikten sonra artı işaretini gezdirin.

Nasıl Kullanılır

  1. "Görsel Seç" düğmesine tıklayın, bir resmi sürükleyip bırakın veya Ctrl+V / Cmd+V ile bir ekran görüntüsü yapıştırın.
  2. Canlı HEX, RGB, HSL değerlerini ve büyüteci görmek için imlecinizi görselin üzerinde hareket ettirin.
  3. Saklamak istediğiniz bir noktaya tıklayın; renk geçmiş paneline kaydedilir.
  4. Tasarıma uygun bir renk şeması oluşturmak için "Paleti Çıkar" düğmesine tıklayın ve ihtiyacınız olan renk kodlarını kopyalayın.

Örnek: Bir ürün arayüzünün ekran görüntüsünü yapıştırın, ana düğme rengini seçin ve HEX kodunu doğrudan CSS veya tasarım dosyanıza kopyalayın.

Temel Özellikler

  • Yerel Görselden Renk Seçimi: Görseller tarayıcı Canvas üzerinde işlenir ve taranır; asla bir sunucuya yüklenmez.
  • Piksel Düzeyinde HEX/RGB/HSL: Canlı HEX, RGB ve HSL değerlerini okumak için işaretçinizi veya parmağınızı görsel üzerinde gezdirin.
  • Büyüteç Hedef Göstergesi: Yakınlaştırılmış önizleme, simge kenarlarını, ekran görüntüsü ayrıntılarını ve küçük renk bloklarını tam isabetle seçmenize yardımcı olur.
  • Baskın Renk Paleti Çıkarıcı: Tarayıcı tarafında piksel örneklemesi yaparak hızlı tasarım referansı için 5 adede kadar baskın rengi çıkarır.
  • Hızlı Kaydetme ve Kopyalama: Renkleri geçmişe eklemek için görsele tıklayın, ardından renk kodunu kopyalamak için herhangi bir renk örneğine dokunun.

İlgili Araçlar

Renk Formatı Dönüştürücü (HEX/RGB/CMYK) - WCAG Kontrast Denetleyici

Entegre WCAG kontrast denetleyicisi ile HEX, RGB, HSL ve CMYK formatları arasında dönüşüm yapın. Baskıya hazır CMYK yüzdeleri ve erişilebilirlik puanları elde edin.
Lorem Ipsum Yer Tutucu Metin Üretici (JSON/HTML) - Geliştirici Çıktısı

Düz metin, HTML <p> etiketleri veya JSON dizisi olarak Lorem Ipsum üretin. %100 yerel, sunucusuz. Çince yer tutucu metin ve esnek uzunluk kontrolleri içerir.
En-Boy Oranı Hesaplayıcı ve CSS Kod Üretici - TikTok/Reels 9:16

En-boy oranlarını ve eksik boyutları hızla hesaplayın. Yerel çalışır, veri yüklemesi yoktur. TikTok/Reels 9:16 önayarları ve CSS aspect-ratio kod parçacıkları içerir.

Hesaplama Mantığı

Bu araç görseli HTML5 Canvas ile yerel olarak çözer ve getImageData aracılığıyla geçerli seçici koordinatındaki RGBA pikselini okur. HEX, RGB ve HSL değerleri bu piksel verisinden biçimlendirilir.

Palet üretimi Canvas piksellerini örnekler, yakın renkleri gruplandırır ve frekansa göre sıralayarak en baskın 5 rengi döndürür. Bu özellik hızlı web ve UI tasarımları için oldukça pratiktir; ancak profesyonel ICC / P3 mutlak renk yönetimi taahhüdü vermez.

Sıkça Sorulan Sorular

Görsellerim bir sunucuya yükleniyor mu?

Hayır. Görsel yükleme, renk seçimi, büyüteç önizlemesi ve palet çıkarma işlemlerinin tamamı tarayıcınızda yerel olarak çalışır.

Bir görselden HEX renk kodunu nasıl alırım?

Bir görsel seçin veya yapıştırın, ardından imlecinizi hedef piksele getirin. Canlı renk anında belirir. Rengi geçmişe eklemek için tıklayın, ardından HEX değerini kopyalamak için renk kutucuğuna dokunun.

Hangi renk formatları destekleniyor?

Araç web tasarımında ve ön uç geliştirmede en yaygın kullanılan HEX, RGB ve HSL formatlarını gösterir ve kopyalar.

Renk neden Photoshop'tan biraz farklı görünebilir?

Canvas pikseli tarayıcınızın işlediği şekilde okur. Tarayıcı davranışları, ekran renk gamı ve gömülü renk profilleri küçük farklılıklara yol açabilir.

Mobil cihazlarda renk seçebilir miyim?

Evet. Dokunmatik ekranlarda artı işaretini hareket ettirmek için parmağınızı görsel üzerinde sürükleyin, ardından rengi sabitlemek için dokunun veya bırakın.