🎨 Renk Kodları Araçları

HEX, RGB, HSL dönüştürücü, renk seçici, palet oluşturucu ve gradient araçları. Web tasarımcıları için profesyonel renk araçları.

Renk Kodları Dönüştürücü

Gelişmiş Renk Seçici

Hazır Renkler:

Renk Paleti Oluşturucu

Gradient Oluşturucu

background: linear-gradient(to right, #667eea, #764ba2);

HEX Renk Kodları Nedir?

HEX (Hexadecimal) renk kodları web tasarımında en yaygın kullanılan renk formatıdır. #FF0000 gibi 6 haneli kodlarla renkleri temsil eder. İlk 2 hane kırmızı, ortadaki 2 hane yeşil, son 2 hane mavi değerini gösterir. CSS'te color: #3B82F6 şeklinde kullanılır.

#FF5733 Turuncu renk

RGB Renk Sistemi

RGB (Red, Green, Blue) renk sistemi kırmızı, yeşil ve mavi ışık karışımıyla renkleri oluşturur. Her renk 0-255 arasında değer alır. rgb(255, 87, 51) formatında yazılır. Dijital ekranlarda kullanılan temel renk sistemidir ve matematiksel hesaplamalarda tercih edilir.

rgb(59, 130, 246) Mavi renk

HSL Renk Modeli

HSL (Hue, Saturation, Lightness) renk modelinde H=renk tonu (0-360°), S=doygunluk (0-100%), L=parlaklık (0-100%) değerlerini temsil eder. hsl(217, 91%, 60%) formatında yazılır. İnsan algısına daha yakın olduğu için tasarımcılar tarafından tercih edilir.

hsl(120, 100%, 50%) Yeşil renk

🎨 Renk Seçici Nasıl Kullanılır?

Gelişmiş renk seçici aracımız Photoshop benzeri profesyonel özellikler sunar:

  • 2D Renk Alanı: Saturation ve lightness değerlerini sürükleyerek ayarlayın
  • Hue Slider: 360° renk spektrumundan istediğiniz tonu seçin
  • Alpha Kontrolü: Şeffaflık seviyesini hassas şekilde ayarlayın
  • Hazır Renkler: 32 popüler renk paletinden hızlıca seçim yapın
  • Canlı Önizleme: Seçtiğiniz rengi anında görün

🌈 Renk Paleti Oluşturma Teknikleri

Profesyonel renk paletleri oluşturmak için renk teorisi kurallarını kullanın:

  • Monokromatik: Aynı rengin farklı ton ve doygunluklarını kullanır
  • Tamamlayıcı: Renk çemberinde karşıt konumdaki renkler (mavi-turuncu)
  • Üçlü (Triadic): Renk çemberinde eşit mesafedeki 3 renk
  • Benzer (Analogous): Renk çemberinde yan yana olan renkler
  • Gradient Geçişler: İki renk arasında yumuşak geçişler

❓ Sık Sorulan Sorular

HEX ve RGB arasındaki fark nedir?

HEX kodları hexadecimal (16'lık) sayı sistemini kullanırken, RGB decimal (10'luk) sistem kullanır. HEX daha kısa (#FF0000), RGB daha okunabilir (rgb(255, 0, 0)). İkisi de aynı renkleri temsil eder, sadece yazım formatları farklıdır.

Web tasarımında hangi renk formatı tercih edilmeli?

CSS'te genellikle HEX kodları tercih edilir çünkü daha kısa ve yaygındır. Ancak şeffaflık (alpha) kullanacaksanız RGBA, renk manipülasyonu yapacaksanız HSL daha uygun olabilir. Modern CSS'te her üç format da desteklenir.

Renk körü kullanıcılar için nasıl renk seçmeliyim?

Renk körü kullanıcılar için yeterli kontrast oranı sağlayın (WCAG 2.1'e göre minimum 4.5:1). Sadece renge dayalı bilgi vermekten kaçının, metin veya simgelerle destekleyin. Kırmızı-yeşil kombinasyonlarında dikkatli olun.

Gradient CSS kodu nasıl oluşturulur?

CSS'te background: linear-gradient(yön, renk1, renk2) formatını kullanın. Örnek: background: linear-gradient(to right, #667eea, #764ba2). Yön olarak to right, 45deg, to bottom gibi değerler kullanabilirsiniz.

Marka renkleri nasıl seçilir?

Marka renkleri hedef kitle, sektör ve marka kişiliğine uygun seçilmelidir. Mavi güven, kırmızı enerji, yeşil doğa ve sağlık çağrışımı yapar. Renk psikolojisini göz önünde bulundurarak, rakiplerden farklılaşan renkler tercih edin.

Mobil uygulamalarda renk kullanımı nasıl olmalı?

Mobil uygulamalarda yüksek kontrast oranı kullanın, küçük ekranlarda okunabilirliği artırır. Dark mode ve light mode için uyumlu renk paletleri hazırlayın. Dokunmatik öğeler için yeterince büyük ve ayırt edici renkler seçin.