Convertor de culori

Introduceți o valoare de culoare în format HEX, RGB sau HSL și vedeți-o convertită instant în toate celelalte formate. Toată procesarea are loc local în browserul dvs.

Introduceți HEX (#rrggbb), RGB (rgb(r,g,b)) sau HSL (hsl(h,s%,l%)) — sau folosiți selectorul de culori.
Copiat!

Contrast pe fundaluri simple

Pe alb
Pe negru

Despre formatele de culori

  • HEX — #rrggbb, cel mai comun format de culoare CSS.
  • RGB — rgb(r, g, b), fiecare canal 0-255.
  • HSL — hsl(h, s%, l%), nuanță 0-360°, saturație și luminozitate 0-100%.

Se acceptă orice înțelege browserul, inclusiv un nume precum rebeccapurple, un hexazecimal de opt cifre cu alfa și forma separată prin spații, cu bară oblică înaintea alfei, pe care o folosește CSS-ul actual. Cifrele de contrast urmează formula WCAG pentru luminanța relativă, deci un raport de 4.5 este pragul pentru textul obișnuit la nivelul AA, iar 7 este pragul la AAA. Sunt calculate pe culoarea opacă, fiindcă una translucidă nu are un contrast fix până nu se știe ce se află în spatele ei.

Instrumente înrudite

Compresor / Formatator CSS Imagine în Base64 Generator de Cod QR

Vă stă marcajul în cale?

Entitățile cu escape, codificările stricate și conținutul care arată într-un fel în CMS și în alt fel pe pagină înseamnă de obicei că ceva din lanț ghicește. Construim interfețe și drumul de publicare din spatele lor, ca vizitatorul să vadă ce ați scris.

Să vorbim despre site-ul dumneavoastră

Întrebări frecvente

Ce formate de culoare pot lipi?
Hexazecimal de trei, patru, șase sau opt cifre, rgb și rgba, hsl și hsla, hwb și orice nume de culoare CSS. Se acceptă atât forma cu virgule, cât și cea modernă, separată prin spații, cu bară oblică înaintea alfei, deci puteți lipi direct dintr-o foaie de stil.
Cum este tratată transparența?
Canalul alfa supraviețuiește conversiei, deci un hexazecimal de opt cifre revine ca rgba, iar previzualizarea arată o tablă de șah în spate. Alfa este scris în ieșire doar când chiar este sub opacitatea deplină, dacă nu cereți să apară mereu.
Ce înseamnă cifrele de contrast?
Sunt raportul de contrast WCAG dintre această culoare și un fundal simplu, alb sau negru. Textul obișnuit are nevoie de 4.5 pentru nivelul AA și de 7 pentru AAA; textul mare are un prag mai jos. Sub 3 este greu de citit pentru majoritatea oamenilor, la orice mărime.
De ce este contrastul calculat fără alfa?
Fiindcă o culoare translucidă nu are un contrast fix. Ce vede cu adevărat cititorul depinde de ce se află în spate, deci cifrele folosesc culoarea opacă. Dacă textul chiar este translucid, calculați întâi culoarea rezultată din amestec și verificați-o pe aceea.
Care este diferența dintre HSL și HWB?
Ambele pornesc de la același unghi de nuanță. HSL descrie o culoare prin cât este de saturată și cât de deschisă, perechea pe care o arată majoritatea instrumentelor. HWB o descrie prin cât alb și cât negru sunt amestecate, ceea ce seamănă mai mult cu felul în care se amestecă vopseaua și este mai ușor de urmărit când construiți o scară de nuanțe.