Bir Görselden Hex Renk Kodu Nasıl Alınır (2026)

Bir görseliniz var ve ondan tek bir sayıya ihtiyacınız var: belirli bir rengin hex kodu. Belki marka özelliği çoktan gitmiş bir logo, mavisini eşleştirmek istediğiniz bir sitenin ekran görüntüsü ya da yeniden kullanmak istediğiniz bir tonu olan bir fotoğraf. Rengin ne olduğunu düşündüğünüzü yazmak işe yaramaz — gözünüz bir ekrandan #3A7BD5'i okuyamaz ve doğru görünen renk genellikle birkaç hane sapar. İşte gerçek değeri doğrudan piksellerden nasıl okuyacağınız.

Tahmin etmek neden tam olarak işe yaramaz

Ekranda tek bir "mavi" aslında neredeyse aynı mavilerin bir yayılımıdır ve monitörünüzün parlaklığı ve kalibrasyonu onları daha da kaydırır. Gözle seçin, yakın ama yanlış inersiniz — yeterince yakın ki uyumsuzluk can sıkıcı ama bariz değil, dolayısıyla düğmenin neden başlığa uymadığını merak ederek on dakika yakarsınız. Çözüm, tahmin etmeyi bırakmak ve pikselin gerçekte sakladığı sayıyı okumaktır.

Kodu üç adımda alın

Güvenilir yol, pikseli bir renk seçiciyle doğrudan örneklemektir.

1. Görseli yükleyin. Çektiğiniz logoyu, ekran görüntüsünü ya da fotoğrafı bırakın.
2. Tam piksele gelin. Bir büyüteç merceği imlecinizi izler ve altındaki alanı büyütür, böylece sert bir kenarda hangi pikselin düz marka rengi, hangisinin ikisinin kenar yumuşatılmış bir karışımı olduğunu görebilirsiniz.
3. Kaydetmek için tıklayın, sonra kopyalayın. Her tıklama, rengi HEX, RGB ve HSL'sini gösteren bir renk örneği olarak tutar, her birinin kendi kopyalama düğmesiyle. HEX'e tıklayın ve panonuzdadır.

Doğru piksele inin

Mercek, kulağa geldiğinden daha çok önemlidir. Bir rengin bir başkasıyla buluştuğu yerde — bir arka plana karşı bir harf, bir simgenin kenarı — aradaki pikseller kenar yumuşatılmıştır: ikisinden biri değil, iki rengin yumuşatılmış bir karışımı. Orada örnekleyin, hiçbir şeyle eşleşmeyen çamurlu bir değer elde edersiniz. Şeklin birkaç piksel içinde, rengin düz olduğu düz bir alanı hedefleyin ve yakınlaştırılmış görünüm, tıklamadan önce üzerinde olduğunuzu doğrulamanızı sağlar.

Temiz bir logoda ya da düz bir arayüzde bu kolaydır — renk geniş bir alanda tekdüzedir. Bir fotoğrafta daha çok özen gerektirir, çünkü tanecik ve sıkıştırma komşu piksellerin gerçekten farklı olması demektir. Sakin, eşit aydınlatılmış bir bölgeden seçin ve uyuştuklarını kontrol etmek için birkaç örnek alın.

HEX, RGB ya da HSL — uyanı alın

Her renk örneği size üçünü birden verir, böylece hedefinizin istediği hangisiyse onu kopyalarsınız:

• HEX (#3A7BD5) — web varsayılanı. CSS, Figma, Canva, marka belgeleri. Aksini yapmak için bir nedeniniz yoksa bunu kopyalayın.
• RGB (rgb(58, 123, 213)) — kanal değerleri, bir araç onları istediğinde ya da rgba aracılığıyla saydamlığa ihtiyacınız olduğunda kullanışlı.
• HSL (hsl(215, 65%, 53%)) — renk tonu, doygunluk, açıklık. Rengi ayarlamak istediğinizde en iyisi: bir üzerine gelme durumu için parlatmak, bir varyant için soluklaştırmak ya da ondan bir ölçek oluşturmak.

Her renk örneği üçünü birden taşıdığından, format değiştirmek için asla yeniden örneklemezsiniz.

Bir kerede birkaç renk alma

Bir logo nadiren tek bir renktir. Ana rengi, vurguyu ve yazı rengini tek geçişte tıklayın — her biri listede yığılır, böylece görseli üç ayrı kez yüklemek yerine onları karşılaştırabilir ve peş peşe kopyalayabilirsiniz.

Belirli pikseller yerine bütün bir görselin renk özetini — bir fotoğrafın oluşturulduğu genel paleti — istiyorsanız, bu farklı bir iştir ve img.diy'nin ayrı palet aracı baskın renkleri sizin için otomatik çıkarır. İstediğiniz tam noktayı bildiğinizde bu seçiciyi kullanın; görselin sizin için karakterize edilmesini istediğinizde palet aracını kullanın.

Cihazınızda kalır

Görsel tarayıcınızda bir tuvalden yerel olarak okunur — hiçbir şey yüklenmez, kayıt yoktur ve ilk yüklemeden sonra çevrimdışı çalışır. Böylece piyasaya sürülmemiş bir maket ya da bir müşterinin özel varlığı, yalnızca ondan bir hex koda ihtiyacınız olduğu için makinenizden asla ayrılmaz.

Görseli yükleyin, piksele gelin, tıklayın ve kodu kopyalayın.