Convertor de culori
Conversia culorilor între diferite formate: HEX, RGB, HSL și HSV. Esențial pentru designeri și dezvoltatori care trebuie să lucreze cu culori pe diferite platforme și instrumente de design. Convertiți instantaneu orice valoare de culoare în formatul de care aveți nevoie pentru CSS, software grafic sau alte aplicații.
Întrebări frecvente
HEX este o notație hexazecimală (de exemplu, #FF5733) utilizată frecvent în web design. RGB reprezintă culorile folosind valorile Roșu, Verde și Albastru (0-255). HSL utilizează Hue (0-360°), Saturation (0-100%) și Lightness (0-100%), ceea ce îl face intuitiv pentru ajustarea culorilor. HSV utilizează Hue, Saturation și Value (luminozitate), popular în programele grafice. Fiecare format are punctele sale forte pentru diferite cazuri de utilizare.
Utilizați HSL atunci când trebuie să ajustați luminozitatea sau saturația unei culori, păstrând în același timp nuanța constantă. HSL este mai intuitiv pentru a crea variații de culoare, nuanțe și nuanțe. Este excelent pentru crearea schemelor de culori accesibile și pentru designul receptiv, unde aveți nevoie de ajustări previzibile ale luminozității. RGB este mai bun atunci când aveți nevoie de un control precis asupra canalelor de culoare individuale.
Utilizați instrumentele de dezvoltare ale browserului dvs. pentru a inspecta elementul și copiați valoarea culorii din CSS. Lipiți-o în convertorul nostru în orice format (HEX, RGB sau HSL) și vă vom afișa instantaneu valorile echivalente în toate celelalte formate. De asemenea, puteți utiliza extensii de browser sau dispozitive de selectare a culorilor prin captură de ecran pentru a captura culorile.
Canalul alfa controlează transparența, cu valori de la 0 (complet transparent) la 1 (complet opac). RGBA și HSLA includ această a patra valoare pentru a suporta culori transparente sau semitransparente. Acest lucru este esențial pentru suprapuneri, umbre și elemente de design stratificate în designul web modern.
Da! Browserele moderne acceptă pe deplin formatele de culoare HSL și HSLA în CSS. Utilizați sintaxa: hsl(360, 100%, 50%) sau hsla(360, 100%, 50%, 0,5) pentru culori cu transparență. HSL este deosebit de util în CSS pentru a crea variații de culoare utilizând calc() sau proprietăți personalizate CSS pentru tematică dinamică.
Codurile HEX cu trei cifre (#RGB) sunt abrevieri în care fiecare cifră este dublată. De exemplu, #F00 este echivalent cu #FF0000. Această abreviere funcționează numai atunci când ambele cifre ale fiecărui canal de culoare sunt identice. Utilizați formatul complet de 6 cifre (#RRGGBB) pentru un control precis al culorilor și pentru orice culoare care nu se potrivește cu modelul stenografic.
RGB este conceptul general de reprezentare a culorilor cu valori de roșu, verde și albastru. sRGB (standard RGB) este un spațiu specific de culoare RGB standardizat pentru consecvență între dispozitive și browsere web. Majoritatea culorilor web presupun sRGB, motiv pentru care, în general, culorile arată consecvent pe diferite ecrane și browsere.
După convertirea culorilor, verificați raporturile de contrast pentru accesibilitatea textului. WCAG impune un contrast de 4,5:1 pentru textul normal și de 3:1 pentru textul mare. La conversia între formate, valorile culorilor rămân aceleași, dar faptul că le aveți în formate diferite vă ajută să le utilizați în diferite instrumente de proiectare, menținând în același timp accesibilitatea.
Da! Programele de proiectare precum Figma, Adobe XD sau Photoshop afișează de obicei culorile în format RGB sau HEX. Copiați aceste valori și convertiți-le în formatul necesar pentru codul dvs. Acest lucru asigură potrivirea perfectă a culorilor între machetele de design și implementarea finală.
Conversia între formatele de culoare poate implica rotunjirea. HEX utilizează numere întregi (0-255), RGB utilizează numere întregi, dar HSL/HSV utilizează grade și procente. Atunci când convertiți de mai multe ori, pot apărea variații minore datorate rotunjirii. Pentru potrivirea critică a culorilor, lucrați în mod consecvent într-un singur format.
