Hızlı başlangıç
-
Bir renk girin
Örneğin #D4A853 veya rgb(212, 168, 83).
-
Önizleme swatch
Üst örneği geçerli rengini yansıtır.
Renk Dönüştürücü
Tasarım özellikleri ve CSS arasında renk formatlarını değiştiriyor. HEX, RGB veya HSL düzenleyin; diğer formatları senkronize etmek ve örneği önizlemek için bulanıklaştırın.
Gizlilik: yerel olarak işlenir, asla yüklenmez.
Anında sonuçları görmek için aşağıdaki giriş alanına yapıştırın
在 HEX、RGB、HSL 之间互转，实时预览色块。
HEX
RGB
HSL
Notlar
格式说明
HEX 如 #D4A853；RGB 如 rgb(212, 168, 83)；HSL 如 hsl(41, 56%, 60%)。编辑任一字段后失焦即可同步其他格式。
Tasarım özellikleri ve CSS arasında renk formatlarını değiştiriyor. HEX, RGB veya HSL düzenleyin; diğer formatları senkronize etmek ve örneği önizlemek için bulanıklaştırın.
Özellikler ve kullanım durumları
Tasarım ve CSS değişken yazarlık için swatch önizleme ile HEX, RGB, HSL, CMYK dönüştürün.
Marka kılavuzları, koyu mod ayarlama, baskı vs ekran rengi ve Tailwind palet seçimi için kullanın.
Frontend kullanım durumları
CSS değişkenleri için Figma'dan hsl()'e HEX'i kopyalayın veya DevTools rgb'yi tasarım HEX'e dönüştürün.
Tipik iş akışı
Tasarımcılar HEX değerleri sağladıklarında, geliştiricilerin genellikle CSS için RGB veya HSL 'ye dönüştürmeleri gerekir. # 4285F4'ü girin ve RGB(66,133,244) ve HSL(217,89%,61)'e otomatik olarak dönüştürür. Herhangi bir formatı kod editörüne kopyalayın - elle hesaplamadan daha hızlı ve daha doğru.
CSS renkleri ayarlarken, HSL Açıklık değerini doğrudan değiştirin (örneğin,% 61'i% 55'e değiştirin). Araç HEX / RGB anında senkronize eder ve yeni renk önizlemesini gösterir. Bu, tekrar tekrar kod düzenlemeyi ve tarayıcıyı yenilemeyi yenir.
Örnekler
Altın marka
Input
#D4A853
Output
hsl(41, 56%, 60%)
FAQ
Alfa kanalı mı?
8-Digit HEX ve rgba / hsla girişleri desteklenir.
RGB çıkışı neden tasarım aracımdan farklıdır?
Bazı tasarım araçları, RGB'yi yüzdeler (0-100) veya renk profilleri ile gösterir. Bu araç 0-255 RGB değerleri ile CSS standartlarını izler. Uyarşmazlıklar meydana geldiğinde, referans olarak HEX değerini kullanarak çapraz kontrol edin.