Hex Renk Seçici ve Dönüştürücü (RGB, HSL, HSV)

Doğrudan tarayıcınızda hex'i RGB, HSL ve HSV'ye dönüştürün, uyum renk örneklerini kopyalayın ve CSS veya JSON'u dışa aktarın.

Etkileşimli özellikler için JavaScript gereklidir. Bu aracı kullanmak için lütfen tarayıcınızda JavaScript'i etkinleştirin.

Altıgen renk

#RGB veya #RRGGBB girin (# ile veya olmadan). Geçersiz değerler son iyi dönüşümü korur.

Dönüşümler

HEX#3B82F6

RGBrgb(59, 130, 246)

HSLhsl(217.219, 91.2%, 59.8%)

HSVhsv(217.219, 76%, 96.5%)

Uyum örnekleri

Armoni türü

Renk örneği sayısı

Renk tonu / gölge şeridi

Renk tonu/gölge adımları

Renk örneklerini dışa aktar

CSS

:root {
  --color-base: #3B82F6;
  --color-analogous-1: #3BF6AF;
  --color-analogous-2: #3BDFF6;
  --color-analogous-3: #3B82F6;
  --color-analogous-4: #513BF6;
  --color-analogous-5: #AF3BF6;
  --color-tint-shade-1: #000000;
  --color-tint-shade-2: #0A162B;
  --color-tint-shade-3: #142D55;
  --color-tint-shade-4: #1F4380;
  --color-tint-shade-5: #295AAA;
  --color-tint-shade-6: #3370D5;
  --color-tint-shade-7: #3D87FF;
}

JSON

{
  "baseHex": "#3B82F6",
  "harmony": "analogous",
  "harmonyCount": 5,
  "harmonySwatches": [
    "#3BF6AF",
    "#3BDFF6",
    "#3B82F6",
    "#513BF6",
    "#AF3BF6"
  ],
  "tintShadeStrip": [
    "#000000",
    "#0A162B",
    "#142D55",
    "#1F4380",
    "#295AAA",
    "#3370D5",
    "#3D87FF"
  ],
  "stripCount": 7
}

Onaltılı bir renk seçin veya yapıştırın, RGB, HSL ve HSV'ye dönüştürün, tamamlayıcı/analog/üçlü/tek renkli renk örnekleri oluşturun, değerleri kopyalayın ve CSS veya JSON'u dışa aktarın. Ücretsiz, hızlı ve tamamen tarayıcınızda çalışır.

Bu altıgen renk seçici nasıl kullanılır?

Onaltılık bir değer yazın veya yapıştırın ya da yerel seçiciyi kullanın. Sayfa onu anında RGB, HSL ve HSV'ye dönüştürür, uyum renk örnekleri ve renk tonu/gölge şeridi oluşturur ve her şeyi kopyalamaya hazır tutar. Kurulumunuzu URL ile paylaşın; durum, sorgu dizesinde saklanır.

Hex, RGB, HSL ve HSV referansı

Hex kompakt bir RGB kodlamasıdır. RGB, kırmızı/yeşil/mavi kanalları tanımlar. HSL renk tonunu, doygunluğu ve açıklığı ifade eder; HSV renk tonu, doygunluk ve değeri (parlaklık) kullanır. Bu araç, tarayıcınızda deterministik matematik kullanır; yükleme veya harici API yoktur.

Tamamlayıcı, benzer, üçlü ve tek renkli

Tamamlayıcı renk tonunu 180° döndürür. Benzer adımlar, tabanınızın etrafında sabit bir açıyla renklenir. Triadik 120° ofsetleri kullanır. Monokromatik renk tonunu tutar ve açıklığı değiştirir. Sayım kontrolleri analog ve monokromatik modlara uygulanır.

CSS değişkenleri ve JSON dışa aktarımı

Dışa aktarma, sabit adlara sahip :root özel özellikleri (örneğin --color-base, --color-analogous-1) ve baseHex, uyum modu ve komut dosyaları veya tasarım belirteçleri için renk örneği listeleri içeren JSON üretir.

Sıkça Sorulan Sorular

#ABC altı haneye genişliyor mu?

Evet. Üç basamaklı onaltılık basamak çifti başına genişletilir, böylece #ABC #AABBCC olur.

Hex'im geçersizse ne olur?

Bir satır içi hata görüyorsunuz. Son geçerli renk, siz tekrar geçerli bir onaltılık sayı girinceye kadar dönüştürme satırlarında, seçicide ve dışa aktarmalarda kalır.

Armoni renkleri nasıl hesaplanır?

Bunlar deterministiktir: tamamlayıcı, HSL'deki 180°'lik renk tonu değişimidir; benzer şekilde sabit renk tonu adımları kullanılır; üçlü 120° ofsetleri kullanır; monokromatik, renk tonunu ve doygunluğu tabandan korurken açıklığı değiştirir.

JSON dışa aktarımında neler var?

Kararlı tuşlar: baseHex, Harmoni, HarmonyCount uygun olduğu yerde, HarmonySwatches (hex strings), tintShadeStrip ve stripCount—alet oluşturma veya dokümantasyon için uygundur.

Renklerimi paylaşabilir miyim?

Evet. URL, onaltılık, uyum modu, sayımlar ve şerit boyutuyla güncellenir, böylece tam bir kurulumu yer imlerine ekleyebilir veya paylaşabilirsiniz.