Bir Uygulamada veya Web Sitesinde Belirli Bir Renk Nasıl Belirlenir?
Çeşitli / / October 04, 2023
Web ve uygulama tasarımı, duyguların aktarılması, markalaşma veya kullanıcı deneyimlerinin geliştirilmesi olsun, renkler kesinlikle hayati bir rol oynamaktadır. Ancak doğru rengi veya renk kombinasyonunu bulmak söylenenden daha kolaydır. Neyse ki, bir uygulama veya web sitesindeki belirli renkleri tanımlamak için elimizde bazı araçlar var, böylece dikkatimizi çeken renkleri seçip kaydedebiliyoruz.
![How_to_Identify_Specific_Color_on_an_App_or_Website](/f/6e1a5c1f201aa0007b51936c5fcc23a4.jpg)
Bir web sitesinde gezindiğinizi ve mükemmel rengi, bir sonraki projeniz için tam olarak ihtiyacınız olan tonu bulduğunuzu hayal edin. O halde bir web sitesi veya uygulamadaki arka planların veya diğer öğelerin tam rengini bulmanıza yardımcı olalım.
Bir web sitesinden renk kodu almanın en kolay yollarından biri, özel web araçlarını ve renk seçici web sitelerini kullanmaktır. Hangi tarayıcıyı kullanırsanız kullanın, Krom bazlı, ile derin web uyumluluğuveya Apple'ın varsayılan Safari'si için bu yöntem geçerlidir.
Üstelik ister Mac, ister Windows dizüstü bilgisayar, iPhone, iPad veya Android cihaz kullanıyor olun, bu renk tanımlayan web araçları cephaneliğinize kullanışlı bir katkı olacaktır. Birkaç seçeneği test ettik ve işte bize en uygun olanı.
Aşama 1: Tarayıcınızı açın ve ImageColorPicker.com'a gidin
GörüntüRenk Seçici
Adım 2: Web sitesi/resim URL'sini sağlamak veya resmi yüklemek için Resminizi Kullan'a tıklayın/dokunun.
![ImageColorPicker 1'i Kullanarak Web Sitelerinde HEX Renk Kodunu Bulma](/f/91311f8f159377d9762b8662c5f7c10f.png)
Aşama 3: Artık şunları da yapabilirsiniz:
- Web sitesi adresini kopyalayın
- Resmi veya URL'sini kopyalayın
- Sayfanın ekran görüntüsünü alın
![ImageColorPicker 2'yi Kullanarak Web Sitelerinde HEX Renk Kodunu Bulun](/f/653ee71f44db35dc788e7b0aef2ab173.png)
4. Adım: Görüntü işlendikten sonra rengi seçmek için imlecin etrafında hareket edebilirsiniz.
Adım 5: Buna bağlı olarak HEX veya RGB kodunu göreceksiniz, bunları kopyalayıp yapıştırın ve gerektiği gibi kullanacaksınız.
![ImageColorPicker 3'ü Kullanarak Web Sitelerinde HEX Renk Kodunu Bulun](/f/aba29317f8eca5c9996d34baf0ef43c5.png)
ImageColorPicker.com'u sevmiyorsanız veya daha fazla seçenek istiyorsanız aşağıdaki web sitelerini deneyebilirsiniz.
KırmızıKetçap Renk Seçici
HTML Renk Kodları
Çam Araçları
Ancak ImageColorPicker'ın aksine bu web siteleri web sitesi veya görsel URL'lerini desteklemez. Görüntü yükleme konusunda size güveniyorlar. Bu nedenle ekran görüntüleri almanız, yüklemeniz ve ardından rengi bulmanız gerekecek.
2. Fotoğraf Düzenleme Yazılımıyla Bir Web Sitesinden Renk Seçin
Bir fotoğraf düzenleme aracı kullanıyorsanız, daha fazla bakmanıza gerek yok. İster Photoshop gibi gelişmiş fotoğraf düzenleme yazılımları ister Canva gibi çevrimiçi araçlar olsun, çoğu fotoğraf düzenleme yazılımı kullanışlı bir renk seçici/göz damlası aracıyla donatılmıştır: Mac’in Hızlı Bakışı, Ve iPhone'un ekran görüntüsü düzenleyicisi.
Ancak hepsi renk kodunu bir web sitesinden veya uygulamadan almanıza yardımcı olmayabilir. Pencerelerindeki rengi seçmenize ve kullanmanıza izin verecekler. Bu sizin için uygunsa, belirli renkleri tanımlamak için seçtiğiniz bir fotoğraf düzenleme aracını kullanın. Canva Örnek olarak.
Aşama 1: Web sitesinin veya uygulamanın ekran görüntüsünü alın.
Adım 2: Canva'yı bir tarayıcıda (veya mobil cihazınızdaki uygulamada) açın.
Aşama 3: Bir tuval seçin ve resmi yükleyin.
![Rengi seçmek için resim yükleyin](/f/8bddceefc80c205cb1c1502037284f0b.png)
4. Adım: Daha sonra renkle ilgili herhangi bir aracı, metni, çizimi, öğeleri vb. açın.
Adım 5: Renk kutusunu seçin ve ardından '+ Yeni renk ekle' simgesine tıklayın.
![Renk aracını seçin](/f/b091d99b241e241bf437690f46a0f010.png)
Adım 6: Renge gidin ve istediğiniz rengi seçmek için tıklayın/dokunun.
![Rengi seçmek için damlalık kullanın](/f/eaf3ca5aa43ba4a71bfd7a22b3fa9cb6.png)
3. Herhangi Bir Web Sitesinden Renk Bulmak için Firefox'ta Renk Seçiciyi Kullanın
Firefox tarayıcısı, fotoğraf düzenleme yazılımının yanı sıra yerleşik bir damlalık aracına da sahiptir. Her ne kadar biraz gizli olsa da hadi hack'i ortaya çıkaralım.
Aşama 1: Firefox'u başlatın ve renk seçmek istediğiniz web sitesini açın.
Adım 2: Sağ üst köşedeki üç çizgili simgeye dokunun
Aşama 3: Diğer Araçlar'ı ve ardından Damlalık'ı seçin.
![Diğer Araçlar'ı ve ardından Damlalık'ı seçin](/f/649ac9ecc69dcf2805f5edaa7ef94178.png)
4. Adım: Şimdi imlecinizi tanımlamak istediğiniz rengin üzerine getirin, Firefox anında onaltılık renk kodunu bulacak ve size sunacaktır.
![Firefox araçlarını kullanarak rengi seçin](/f/1c0653d4f7fbf77b3c51c9cbc418db3c.png)
Adım 5: Özellikle, Damlalık siz çıkana kadar renk kodlarını incelemeye ve iletmeye devam edecektir. Aracı kapatmak için ekranda herhangi bir yere tıklamanız yeterlidir.
Tıpkı Firefox gibi Chrome'un da bir web sitesindeki belirli renkleri tanımlamanıza yardımcı olabilecek bazı geliştirici araçları vardır. Ancak bir sorun var; Hadi bulalım.
Google Chrome'un renk seçme aracı oldukça sınırlıdır. Bu hile yalnızca siteye kodlanan öğelerin renklerini, yani kodlarda belirtilen renkleri söyleyebilir. Dolayısıyla logolar, resimler vb. içe aktarılan öğeler hakkında renkle ilgili herhangi bir bilgi alamazsınız.
Aşama 1: Chrome'u başlatın ve renk seçmek istediğiniz web sitesini açın.
Adım 2: Daha sonra sağ üst köşedeki üç nokta simgesine tıklayın.
Aşama 3: Diğer Araçlar'ı ve ardından Geliştirici Araçları'nı seçin.
![Diğer Araçlar'ı ve ardından Geliştirici Araçları'nı seçin](/f/4391b30c5b390e280fc887410d882d86.png)
Not: Ekranınız görsel olarak iki sayfaya bölünecektir. Solda web sitesini, sağda ise site kodunu göreceksiniz.
4. Adım: Web sitesinden bir renk seçmek için Ctrl + Shift + C tuşlarına basın ve imleci seçmek istediğiniz renge getirin.
Adım 5: Artık arka planı, metni veya öğe renk kodunu görüntüleyebilirsiniz.
![Rengi bulmak için öğeyi seçin](/f/f3d4f7aae5a7ab4dd6919e01c718e688.png)
5. Web Sitelerindeki Bir Rengin Hex Kodunu Bulmak için Tarayıcı Uzantılarını Kullanın
Tarayıcı uzantıları yalnızca üretkenliğinizi artırmakla kalmaz, aynı zamanda renk tanımlamasını daha da kolay hale getirir. Neyse ki, Chrome ve Firefox desteği de dahil olmak üzere en yaygın tarayıcıların cephaneliğinde bu tür uzantılar var.
Rengi Tanımlamak için Chrome Uzantısı
Altıgen Renk Seçici
Göz Damlalığı
Renk Damlalığı
Rengi Tanımlamak için Firefox Uzantısı
ColorZilla
Renk Seçimi Damlalık
İstediğiniz uzantıyı tarayıcınıza ekledikten sonra gerisi çocuk oyuncağıdır. Web sitesini açın → menü çubuğundan uzantıyı seçin → imleci rengin üzerine getirin → renk kodunu alın.
![Web Sitelerindeki Bir Rengin Hex Kodunu Bulmak için Tarayıcı Uzantılarını Kullanın](/f/b1dbabc33d22f70a2a4d0519acf93793.png)
Renginizi Seçin
İster bir tasarımcı, geliştirici olun, ister karşılaştığınız bir rengi merak eden biri olun, bir uygulama veya web sitesindeki belirli renkleri tanımlamak yararlı bir beceridir. Bu nedenle, bulunması zor renk kodunu veya renk adını bulmanıza yardımcı olacak birçok yöntem ve aracı ele aldık.
Umarım size hizmet edebiliriz. Bu tür tüyolara veya önerilere daha fazla ihtiyacınız varsa veya teknolojiyle ilgili bazı kafa karıştırıcı soruların yanıtlarına ihtiyacınız varsa, yorum bölümü her zaman açıktır.