Přeskočit na hlavní obsah
Converty

Převodník barev

Převádějte mezi hex, RGB, HSL, OKLCH a OKLAB, kontrolujte kontrast a exportujte tokeny připravené pro CSS.

Podporuje hex, rgb(), hsl(), oklch(), oklab() a pojmenované CSS barvy.

Aktuální barva

#953769

Doporučené popředí

#FFFFFF

Komplementární barva

#007653

Hex
RGB(A)
HSL(A)
OKLCH
OKLAB
Alpha
Tailwind téma
Vygenerujte z aktuální barvy kompletní značkovou paletu pro Tailwind CSS 4 nebo 3.
50
oklch(94.5% 0.0212 350.46)
100
oklch(89.49% 0.0339 350.46)
200
oklch(81.48% 0.0542 350.46)
300
oklch(72.47% 0.0771 350.46)
400
oklch(61.46% 0.105 350.46)
500
oklch(48.44% 0.138 350.46)
600
oklch(43.57% 0.1236 350.46)
700
oklch(38.7% 0.1093 350.46)
800
oklch(33.22% 0.0932 350.46)
900
oklch(27.74% 0.077 350.46)
950
oklch(23.48% 0.0644 350.46)
CSS proměnné

O převodu CSS barev

Převodníky barev vám pomohou převést stejnou barvu mezi HEX, RGB, HSL, OKLCH a OKLAB. Nejvíc se hodí, když potřebujete čitelný výstup, kontext kontrastu a hodnoty připravené pro CSS nebo Tailwind.

HEX, RGB, HSL a CSS barvy

HEX, RGB a HSL pokrývají většinu běžných workflow v prohlížeči, designu a frontendu.

Rychlý převod vám umožní vložit jednu hodnotu a používat ji kdekoli bez ručního přepisování syntaxe.

Proč jsou OKLCH a OKLAB důležité

OKLCH a OKLAB jsou lepší pro tvorbu plynulých škál a předvídatelných změn světlosti.

Usnadňují práci s paletami, když potřebujete vyvážené přechody a spolehlivý kontrast.

Kontroly kontrastu a výstup pro Tailwind

Kontrola kontrastu a výstup připravený pro frameworky dělají z převodníku praktický UI nástroj.

Z jedné vstupní barvy se rychleji dostanete k přístupným barvám textu a tokenům připraveným pro Tailwind.

Často kladené otázky

Odpovědi o podporovaných formátech barev, kdy použít percepční prostory jako OKLCH, a jak interpretovat výstupy pro kontrast a Tailwind.

Další nástroje

Procházejte všechny samostatné stránky nástrojů z úvodního rozcestníku nebo z vycentrovaného selektoru v záhlaví.

Obrázky

Převodník WebP

Převeďte až 10 obrázků JPEG, PNG nebo WebP do formátu WebP s předvolbami kvality a stahováním ZIP.

Otevřít Převodník WebP

Assety

Generátor favicon / ikon aplikace

Nahrajte jeden čtvercový zdrojový obrázek a vygenerujte balíček favicon s ikonami aplikace a základním webovým manifestem.

Otevřít Generátor favicon

Datové formáty

Převodník JSON / YAML / TOML

Validujte, formátujte, minifikujte a převádějte JSON, YAML a TOML s jasnými upozorněními na kompatibilitu.

Otevřít JSON / YAML / TOML

Datové formáty

Validátor CSV

Validujte soubory CSV a vložené řádky pomocí detekce oddělovače, kontrol záhlaví, seznamu problémů a parsovaných náhledů.

Otevřít Validátor CSV

Text

Case / Slug / Escape

Převádějte text do camelCase, snake_case, kebab-case, PascalCase, slugů a běžných escapovaných podob.

Otevřít Case / Slug / Escape

Text

Validátor Markdownu a náhled

Validujte strukturu Markdownu, zobrazte si vykreslený výstup a zachyťte běžné autorské chyby ještě před publikováním.

Otevřít Validátor Markdownu