Convertor de culori

Convertiți între HEX, RGB, HSL, HSV și CMYK. Previzualizare live. Verificator de contrast WCAG pentru accesibilitate. Nimic nu părăsește browserul.

Cum funcționează Convertor de culori

Color Converter traduce orice culoare între formatele HEX, RGB, HSL, HSV și CMYK instantaneu pe măsură ce tastați. De asemenea, rulează o verificare a contrastului WCAG între oricare două culori pe care le alegeți, afișând raportul de contrast și rezultatul pass/fail AA/AAA pentru text normal, text mare și componente UI. Toate calculele au loc în browser fără date trimise nicăieri; nimic din ce tastați nu părăsește dispozitivul dumneavoastră.

Înțelegerea modului în care aceeași culoare arată în diferite modele de culoare este utilă în predarea designului. Un designer poate specifica o culoare de brand ca HEX #1A4F8C; un dezvoltator CSS are nevoie de echivalentul HSL pentru tematizare; o echipă de tipar are nevoie de descompunerea CMYK. Această unealtă face conversia în toate direcțiile odată, astfel încât nu trebuie să rulați mai multe convertoare separate.

Scris de Bastien Sulyan

Cum se folosește Convertor de culori, pas cu pas

Tastați o valoare HEX, dați clic pe o mostra de culoare, sau introduceți valori RGB, HSL, HSV sau CMYK în câmpurile respective.
Toate celelalte reprezentari de format se actualizează imediat pentru a arăta culoarea echivalentă.
Pentru a rula o verificare de contrast, selectează o culoare de prim-plan și o culoare de fundal folosind cele două selectoare de culori.
Citiți raportul de contrast WCAG și insignele pass/fail pentru nivelurile de conformitate AA și AAA.
Copiați orice valoare de culoare folosind pictograma de copiere de lângă fiecare câmp.

Cazuri de utilizare frecvente

Un designer UI convertește un cod HEX de brand în HSL pentru a scrie o proprietate personalizată CSS pentru un sistem de tematizare.
Un dezvoltator web verifică raportul de contrast dintre culoarea textului și fundalul înainte de a livră o componentă pentru a confirma conformitatea WCAG AA.
Un designer de tipar primește o culoare HEX web și are nevoie de echivalentul CMYK pentru a o potrivi într-o broșura tiparita.
Un dezvoltator are nevoie de descompunerea RGB a unui token de design pentru a transmite valorile individuale ale canalelor la o funcție de desenare pe canvas.

Întrebări frecvente

Suportă unealta valori alpha (transparența)?

Convertorul curent funcționează cu culori complet opace (alpha = 1). HEXA (hex pe 8 cifre) și RGBA nu sunt încă în domeniu. Pentru opacitate, setează canalul alpha în CSS separat folosind notația rgba() sau oklch().

Sunt culorile pe care le introduc stocate sau trimise undeva?

Nu. Conversia culorilor este aritmetică pură (remaparea canalelor și scalarea intervalului) care rulează complet în motorul JavaScript al browserului. Nimic din ce tastezi aici nu ajunge la vreun server sau serviciu extern.

Ce niveluri de contrast WCAG suportă verificatorul?

Unealta raportează conform criteriilor de succes WCAG 2.1: AA necesită un raport de contrast minim de 4,5:1 pentru text normal (sub 18pt sau 14pt bold) și 3:1 pentru text mare și componente UI. AAA necesită 7:1 pentru text normal și 4,5:1 pentru text mare.

De ce valorile CMYK difera între această unealtă și software-ul profesional de design?

Conversia RGB-la-CMYK pe care o realizează această unealtă este o formulă matematică fără profil de culoare. Aplicațiile de design profesionale aplică profile de culoare ICC care țin cont de câștigul de punct de cerneală și proprietățile substratului. Valorile CMYK de aici sunt utile pentru aproximare; pentru tipar de producție, aplică întotdeauna profilul de presă în software dedicat.

Pot converti un nume de culoare CSS precum 'cornflowerblue' aici?

Culorile CSS cu nume nu sunt tastate direct în câmpurile convertorului. Pentru a converti o culoare cu nume, găsește mai întâi valoarea HEX într-o referință CSS (cornflowerblue este #6495ED), apoi lipește acel HEX în câmpul HEX pentru a vedea toate celelalte formate.

Funcționează unealta offline după ce pagina s-a încărcat?

Da. Conversia culorilor este aritmetică fără dependență externă. Odată ce pagina este în cache-ul browserului, o puteți deschide fără conexiune la rețea și toate conversiile vor funcționa normal.

Instrumente conexe

Păstrează totul local, explorează instrumente complementare.

Toate instrumentele pentru dezvoltatori