Utilia

Hledač názvu barvy

Zjisti název libovolné barvy. Zadej kód HEX nebo RGB a získáš 5 nejbližších názvů z více než 30 000 pojmenovaných barev a nejbližší název barvy v CSS.

Jak používat hledač názvu barvy

  1. Vyber barvu pomocí Vyber barvu, nebo napiš hodnotu do pole Kód barvy: kód HEX jako #1E90FF, rgb(30 144 255), hsl(210 100% 56%) nebo jinou barvu CSS.
  2. Při prvním použití nástroj načte seznam asi 32 000 názvů barev (několik set kilobajtů, jednou za návštěvu). Poté se výsledky zobrazují už při psaní.
  3. Přečti si Nejbližší název vedle Tvoje barva. Pokud je kód v seznamu přesně, popisek zní Přesná shoda.
  4. Níže je 5 nejbližších názvů a Nejbližší pojmenované barvy CSS s kódem HEX a vzdáleností (ΔE). Pomocí Kopírovat název nebo Kopírovat HEX si vezmeš, co potřebuješ.
  5. V poli Porovnávat pomocí můžeš přepnout na CIEDE2000 (CIELAB) nebo Vzdálenost v OKLab, případně kliknout na Náhodná barva a procházet.

Barva i vyhledávání zůstávají ve tvém prohlížeči. Nic, co zadáš, se neodesílá na server.

Odkud názvy pocházejí

Názvy pocházejí z projektu color-name-list, open-source sbírky, kterou spravuje David Aerne a mnoho přispěvatelů pod licencí MIT. Shromažďuje kolem 32 000 jedinečných názvů z vzorníků barev, historických slovníků barev, přírody, popkultury a návrhů komunity, od „Absolute Zero“ po „Zucchini“. Každý název patří právě jednomu kódu HEX. Názvy jsou anglicky, takže nástroj vrací anglické pojmenování barvy; názvy barev v CSS (tomato, rebeccapurple, dodgerblue…) jsou také anglické.

Nástroj navíc porovnává tvou barvu se 148 pojmenovanými barvami CSS podle CSS Color Level 4, kterým rozumí každý prohlížeč. Synonyma sdílející stejný kód se zobrazují společně, například gray / grey nebo aqua / cyan. Tyto názvy použij ve stylopisu, když chceš něco čitelného.

Jak se vybírá nejbližší barva

Porovnávání kódů HEX číslici po číslici nefunguje: #808080 a #7F8080 jsou téměř shodné, ale malá změna v jiném kanálu může vypadat úplně jinak. Nástroj proto převede každou barvu do percepčního barevného prostoru a vzdálenosti měří v něm.

  • CIEDE2000 (CIELAB) je vzorec pro barevný rozdíl Mezinárodní komise pro osvětlení (CIE), používaný při tisku a míchání barev. Opravuje starší vzdálenost v CIELAB podle toho, jak oči posuzují světlost, chromu a odstín, zejména u modrých a téměř šedých barev. Implementace vychází ze Sharmy, Wu a Dalala (2005) a je ověřena na jejich referenčních datech.
  • Vzdálenost v OKLab je přímá vzdálenost v prostoru OKLab, moderním prostoru navrženém pro rovnoměrné percepční kroky. Zobrazuje se vynásobená 100, aby se četla na škále podobné ΔE2000. Je rychlejší a často se shoduje s CIEDE2000; pokud se liší, jsou rozdíly nenápadné.

Orientačně: ΔE pod 1 většina lidí nepozná, 1 až 2 je velmi malý rozdíl viditelný při srovnání vedle sebe a nad 5 se barvy zřetelně liší. Pokud má nejbližší název velké ΔE, tvá barva prostě leží mezi pojmenovanými barvami.

Nápady, jak využít názvy barev

  • Pojmenuj designové tokeny a vzorky palety něčím přívětivějším než kódem.
  • Popiš barvu v e-mailu, v nabídce produktu nebo v alternativním textu.
  • Najdi klíčové slovo CSS blízké barvě značky pro rychlé prototypy.

Časté dotazy

Jak se jmenuje barva #1E90FF?

Její název v CSS je dodgerblue, jasná azurově modrá, a rozsáhlý komunitní seznam ji nazývá „Clear Chill“ (přesná shoda). Napiš jakýkoli jiný kód a jeho nejbližší názvy najdeš stejným způsobem.

Proč jsou některé názvy neobvyklé?

Seznam vytváří komunita a obsahuje hravé názvy z popkultury a přírody. Prohlédni si pět nejbližších výsledků a vyber ten, který se hodí do tvého kontextu; pojmenované barvy CSS jsou nejstandardnější.

Je nejbližší název přesně moje barva?

Jen tehdy, když popisek říká Přesná shoda a ΔE je 0. Jinak název patří blízké barvě: porovnej oba vzorky vedle sebe.

Kterou metodu porovnání mám použít?

CIEDE2000 je zavedený průmyslový standard a je výchozí. Vzdálenost v OKLab je dobrá moderní alternativa. Když barva leží mezi dvěma názvy, zkus obě.

Mohu hledat podle názvu místo podle kódu?

V tomto nástroji ne. Do pole Kód barvy však můžeš napsat kterýkoli ze 148 anglických názvů barev v CSS, například salmon, a uvidíš další názvy v jeho blízkosti.