tigtools

Convertor de culori

Scrieți sau lipiți o culoare în orice format acceptat ori alegeți una, iar toate celelalte formate se actualizează instantaneu.

Rulează în browser Fără înregistrare

Citit ca HEX.

HEX
#336699
RGB
rgb(51, 102, 153)
HSL
hsl(210, 50%, 40%)
HWB
hwb(210 20% 40%)
OKLCH
oklch(49.93% 0.0987 250.43)
CMYK
cmyk(66.7%, 33.3%, 0%, 40%)

Aici CMYK este o formulă simplă, nu o conversie cu gestionare colorimetrică. Pentru tipar, convertiți folosind profilul ICC furnizat de imprimanta dvs.

Cum se folosește

  1. Scrieți sau lipiți o culoare, de exemplu #1e90ff, rgb(30 144 255) sau oklch(65% 0.18 250). Puteți folosi și selectorul de culoare.
  2. Verificați eșantionul de culoare pentru a vă asigura că este culoarea dorită.
  3. Copiați formatul de care aveți nevoie din listă. Valorile cu transparență își păstrează alfa.

Cum funcționează

Intrări acceptate: HEX cu 3, 4, 6 sau 8 cifre (a 4-a și a 8-a cifră reprezintă alfa), rgb() și rgba() cu numere sau procente, hsl() și hsla(), hwb(), oklch() și cmyk() cu procente sau numere de la 0 la 100. Funcționează atât sintaxa clasică cu virgulă, cât și sintaxa modernă cu spațiu și „/ alfa”. Nuanța acceptă deg, turn, rad și grad. Culorile denumite precum „tomato” nu sunt recunoscute; folosiți selectorul de culoare sau un cod.

Toate conversiile trec prin sRGB. HSL și HWB sunt simple transformări ale valorilor RGB, deci se convertesc exact. OKLCH este un spațiu perceptual: pașii egali în luminozitate par aproximativ la fel de diferiți, ceea ce îl face util pentru crearea de palete. Se calculează cu matricele OKLab publicate. Unele culori OKLCH sunt în afara gamei afișabile sRGB; instrumentul semnalează acest lucru și afișează cea mai apropiată culoare afișabilă.

CMYK se calculează cu formula simplă obișnuită (K = 1 − cel mai mare canal RGB). Rezultatul real al tipăririi depinde de hârtie, cerneală și profilul ICC, deci tratați aceste numere ca punct de plecare, nu ca specificație de tipar.

Exemple

De la un cod HEX de brand la CSS

Un ghid de stil oferă #0b5d1e. Lipiți-l pentru a obține rgb(11, 93, 30) pentru CSS mai vechi, hsl(133.9, 78.8%, 20.4%) pentru a ajusta manual luminozitatea și o valoare oklch() pentru funcțiile moderne de culoare din CSS.

Citirea unei culori cu transparență

rgba(0, 0, 0, 0.5) se convertește în #00000080. Ultimele două cifre HEX (80) sunt alfa: 128 din 255, aproximativ 50 %.

Verificarea unei valori OKLCH dintr-un fișier de design

oklch(70% 0.4 150) este un verde foarte saturat pe care ecranele sRGB nu îl pot afișa. Instrumentul semnalează acest lucru și oferă cea mai apropiată culoare sRGB, astfel încât să știți că designul va arăta diferit pe majoritatea ecranelor.

Întrebări frecvente

De ce conversia în HSL și înapoi schimbă uneori codul HEX cu o unitate?

HEX stochează numere întregi de la 0 la 255 pentru fiecare canal. Valorile în alte formate sunt rotunjite pentru afișare (HSL la o zecimală), iar conversia înapoi a unei valori rotunjite poate duce la o diferență de o unitate. Copiați codul HEX dacă aveți nevoie de valoarea originală exactă.

Este valoarea CMYK corectă pentru tipărire?

Nu, nu de unul singur. Folosește formula simplă, fără un profil de culoare. Tipografii folosesc profiluri precum FOGRA sau GRACoL, care dau valori diferite, așa că întrebați tipografia sau convertiți într-o aplicație cu gestionare a culorilor.

Ce este OKLCH și pot să îl folosesc în CSS?

OKLCH descrie o culoare prin luminozitate percepută, cromă (intensitate cromatică) și nuanță. Versiunile curente ale browserelor majore acceptă oklch() în CSS. Păstrați o soluție de rezervă HEX sau rgb() dacă susțineți browsere mai vechi.

Ce înseamnă un cod HEX din 8 cifre?

#RRGGBBAA: ultimele două cifre reprezintă opacitatea, de la 00 (complet transparent) la ff (complet opac). Forma scurtă #RGBA funcționează la fel, cu o singură cifră pe canal.

Confidențialitate

Culorile sunt convertite în browserul dvs. Nimic din ce introduceți nu este trimis sau stocat.