Webový design a CSS
Převedete barvu z návrhového souboru nebo z nástroje pro výběr snímku obrazovky na hexadecimální kód, který potřebuje váš stylový list.
Převodník RGB na HEX — Převádějte hodnoty RGB na hexadecimální kódy a hexadecimální kódy na RGB, a to s živým náhledem.
Zadejte červená, zelená a modrá čísla, vyberte barvu nebo vložte hexadecimální kód a prohlédněte si všechny formáty najednou: HEX, RGB a HSL. Živý náhled a kontrola kontrastu vám ukážou, která barva textu je nejvhodnější. Vše běží přímo ve vašem prohlížeči.
Převést barvu
Vaše barvy zůstávají ve vašem prohlížeči
Vyberte nebo zadejte barvu
Aa
Barevné kódy
HEX
–RGB (CSS)
–HSL (CSS)
––Jaká barva textu se na něm nejlépe hodí?
–Kontrastní poměr
Průvodce
Průvodce převodem RGB na HEX: barevné kódy, HSL a kontrast
Zjistěte, jak fungují barevné kódy a jak vybírat dobře čitelné barevné kombinace.
K čemu slouží převodník z RGB do HEX?
Displeje vytvářejí všechny barvy smícháním červeného, zeleného a modrého světla. Systém RGB vyjadřuje tuto směs třemi čísly v rozmezí od 0 do 255. Systém HEX zapisuje stejná tři čísla v šestnáctkové soustavě jako krátký kód, například #1F3A5F, který se běžně používá v CSS, designových nástrojích a značkových příručkách.
Zadejte tři čísla, vyberte barvu pomocí výběrového nástroje nebo vložte hexadecimální kód. Všechny formáty se aktualizují současně a navíc získáte verzi v barevném prostoru HSL a informaci o tom, která barva textu je na daném pozadí nejlépe čitelná.
Proč lidé převádějí hodnoty RGB na HEX
Značka a dokumenty
Dbejte na to, aby barvy značky byly jednotné v souboru s logem, v prezentaci i na webových stránkách.
Přístupnost
Než text zveřejníte, zkontrolujte, jaká barva textu na daném pozadí vypadá, a ověřte si kontrastní poměr.
Jak se RGB převádí na HEX
Každé ze tří čísel se převede na dvoucifernou hodnotu v šestnáctkové soustavě a poté se tyto tři dvojice spojí.
RGB: 31, 58, 95
31 = 1F (1 × 16 + 15)
58 = 3A (3 × 16 + 10)
95 = 5F (5 × 16 + 15)
HEX: #1F3A5F
Šestnáctková soustava používá číslice 0–9 a písmena A–F, přičemž A představuje hodnotu 10 a F hodnotu 15. Krátký kód jako #FA0 je zkrácený zápis: každá číslice se zdvojnásobí, takže znamená #FFAA00.
Běžné barvy v RGB a HEX
| Barva | RGB | HEX |
|---|---|---|
| Černá | 0, 0, 0 | #000000 |
| Bílá | 255, 255, 255 | #FFFFFF |
| Červená | 255, 0, 0 | #FF0000 |
| Zelená | 0, 255, 0 | #00FF00 |
| Modrá | 0, 0, 255 | #0000FF |
| Žlutá | 255, 255, 0 | #FFFF00 |
| Oranžová | 255, 165, 0 | #FFA500 |
| Šedá | 128, 128, 128 | #808080 |
Jak používat převodník z RGB do HEX
- Zadejte hodnoty červené, zelené a modré barvy, nebo klikněte na vzorník a použijte nástroj pro výběr barvy.
- Nebo vložte hexadecimální kód do pole „Hex“, pokud chcete postupovat opačně.
- Přečtěte si kódy HEX, RGB a HSL a zkontrolujte kontrastní poměr a nejvhodnější barvu textu.
- Klikněte na tlačítko „Kopírovat“ vedle požadovaného formátu.
Jednoduché tipy pro práci s barvami
- Aby byl text dobře čitelný, snažte se dosáhnout kontrastního poměru alespoň 4,5 : 1 u běžného textu a 3 : 1 u zvětšeného textu.
- U hexadecimálních kódů se nerozlišuje velká a malá písmena, takže #1f3a5f a #1F3A5F představují stejnou barvu.
- Znak # na začátku je v CSS nutný, ale zde je volitelný. Kód můžete vložit s ním i bez něj.
- Obrazovky a tiskárny zobrazují barvy odlišně, takže tištěná barva se nemusí shodovat s tím, co vidíte na obrazovce.
Omezení a ochrana osobních údajů
Ochrana osobních údajů
Barvy se převádějí přímo ve vašem prohlížeči. Na náš server se nic neodesílá ani neukládá. Ve vašem zařízení se ukládá pouze volba malých písmen.
Omezení
Tento nástroj pracuje se standardními 8bitovými barvami sRGB v rozmezí 0 až 255 na kanál. Nepodporuje průhlednost (RGBA ani 8místné hexadecimální hodnoty), CMYK pro tisk ani barevné prostory se širokým barevným rozsahem.
Často kladené otázky
Často kladené otázky k převaděči RGB na HEX
Jak převedu RGB na HEX?
Zadejte hodnoty červené, zelené a modré barvy, vždy v rozmezí od 0 do 255. Nástroj převede každé číslo na dvě číslice v šestnáctkové soustavě a spojí je, takže z čísel 31, 58, 95 vznikne #1F3A5F.
Jak převedu hodnotu v hexadecimálním formátu na RGB?
Vložte hexadecimální kód do pole „Hex“. Tři hodnoty RGB se vyplní najednou. Například #FF8800 odpovídá hodnotám 255, 136, 0.
Musí hexadecimální kód obsahovat znak #?
Ne. Můžete to zadat s nebo bez znaku # a fungují i zkrácené kódy, jako například #FA0. Výsledek vždy obsahuje znak #, takže je připraven pro použití v CSS.
Co znamenají ty tři hodnoty RGB?
Jedná se o hodnoty intenzity červeného, zeleného a modrého světla v rozmezí od 0 (žádné) do 255 (plná intenzita). Hodnota 0, 0, 0 odpovídá černé barvě a hodnota 255, 255, 255 bílé barvě.
K čemu slouží hodnota HSL?
HSL popisuje barvu pomocí odstínu, sytosti a jasu. Často je snazší provádět úpravy ručně, například barvu trochu zesvětlit, a funguje to přímo v CSS.
Co mi říká hodnota kontrastního poměru?
Ukazuje, jak dobře vyniká černý nebo bílý text na daném pozadí. Poměr 4,5 : 1 nebo vyšší je obvyklé minimum pro běžný text podle směrnic o přístupnosti WCAG.
Mohu použít průhlednost?
Tady ne. Tento nástroj zpracovává pouze neprůhledné barvy bez alfa kanálu. Chcete-li dosáhnout průhlednosti, přidejte hodnotu alfa sami do vlastnosti rgba() ve svém CSS.
Ukládají se moje údaje někde nebo se někam odesílají?
Ne. Převod probíhá přímo ve vašem prohlížeči a z vašeho zařízení neopouští žádné údaje. Pro příště se zapamatuje pouze váš výběr malých písmen.
Od uživatelů tohoto nástroje
Recenze
Načítání recenzí…
Pokračuj
Další nástroje v krabici
Na úvodní stránce najdete desítky dalších bezplatných nástrojů, které nevyžadují API klíč.
Generátor UUID
Hromadně vytvořte náhodné UUID typu v4, v7 a v5.
Otevřít nástrojNástroj pro odstranění mezer
Odstraňte nadbytečné mezery, tabulátory a prázdné řádky.
Otevřít nástrojPřevodník jednotek
Převádějte délku, hmotnost, rychlost a další veličiny.
Otevřít nástrojPřevodník římských číslic
Převáděj čísla na římské číslice a naopak.
Otevřít nástroj