Bir web sayfasındaki renk kodunu belirleme

0
4216

Web tasarımında artık birçok kullanışlı araçlar mevcut. Bu işe yeni başlayan veya tembelliği seven arkadaşlar için kullanışlı bir Google Chrome eklentisinden bahsetmek istiyorum. Bir web sayfasındaki renk kodunu belirleme işlemini sayfanın kodlarına giderek bulabilirsiniz veya bu işlem için Gimp vb. resim işleme programları da mevcuttur. Bu yazımda bahsedeceğim eklenti ile zahmetsiz ve etkili bir şekilde bir sayfanın herhangi bir yerinde gördüğünüz bir rengin kodunu kolayca bulabilirsiniz. Bahsedeceğim Eye Dropper adlı eklenti Chrome Web Tarayıcısı için mevcut olup kullanımı için bu tarayıcının yüklü olması gerekiyor.

Öncelikle eğer bu yazıyı Chrome web tarayıcısında okuyorsanız buraya tıklayarak eklentiyi yükleyebilirsiniz. Yükleme sonrasında web tarayıcınızın sağ üst köşesine eklentinin ikonu gelecek.

eye-dropper-menuBu damlalık şeklindeki ikonu tıkladığınızda yine sağ üst tarafta yukarıdaki gibi bir menü açılacak. Yukarıdaki gibi açılan menüdeki Pick color from web page butonunu tıklayarak bulunduğumuz web sayfasındaki bir renk kodunu bulabiliriz. Tıklama sonrasında bu menü kapanacak ve alt tarafında aşağıda da gördüğünüz gibi fareyi dilediğiniz bir rengin üzerine getirdiğinizde o renk ve kodu görünmeye başlar. Fareyi tıklayarak dilediğiniz rengi seçebilirsiniz.

eye-dropper-renk-secimi

 

Sonrasında yine eklentinin menüsü açılacak ve burada seçmiş olduğunuz renk kodunun değişik ifadelerde kodlarını görebilirsiniz. Genelde kullanılan ve # (diyez veya sayı) işareti ile başlayan kodu kopyalayıp dilediğiniz yerde kullanabilirsiniz. Örnek olarak siyah bir rengi kopyaladım ve aşağıda bu örneği görebilirsiniz. Ayrıca dikkat ederseniz örneğimizde black olarak gördüğünüz gibi İngilizce olarak o rengin adını da veriyor.

eye-dropper-renk-sonuc

 

Eklentinin menüsünde bir de Color picker adında bir başlık var. Renk Seçici olarak çevirisini yapabileceğimiz bu kısımdan da görsel olarak renk seçmeniz ve bu rengin kodunu bulmanız mümkün olmaktadır. Farenizle seçmek istediğiniz renk üzerine gelip Select yani Seç dediğinizde sağ tarafta New yazan kısımda bu yeni seçtiğiniz renk bilgileri gelecektir.

eye-dropper-renk-secici

Web sayfalarımda düzenleme yaparken veya bir sayfada görüp beğendiğim rengin kodunu bulmamda bayağı işime yaradı ve sizlerle de paylaşmak istedim. Umarım beğenirsiniz ve beğendiyseniz yazıyı da paylaşırsınız.

İyi bloglamalar…

Paylaşmak önemsemektir!