Hvordan det virker
Spænd hver kanal til 0-255, rund den, og skriv derefter to hexadecimale cifre pr. kanal bag #. HSL er afledt af RGB-forhold: nuance fra den dominerende kanal, mætning fra afstanden mellem max og min, lyshed fra deres gennemsnit.
- HEX accepterer 3 eller 6 cifre; værdier er fastspændt til 0–255.
Hvorfor det betyder noget
Designværktøjer eksporterer forskellige formater, og CSS forventer specifikke. Håndkonvertering inviterer til afrundingsfejl, og den samme farve skrevet på tre måder er let at verificere, når du ser alle repræsentationer side om side.
Et bearbejdet eksempel
rgb(99, 91, 255) er #635BFF og hsl(244, 100%, 68%). HEX-formularen er det, som CSS-forfattere indsætter oftest; HSL er lettere at gøre mørkere eller desaturate uden at gætte nye kanaler.
Almindelige fejl
- Forudsat at den samme HEX ser identisk ud overalt uden farvestyring.
- At glemme den trecifrede HEX udvider hver nibble to gange.
- Redigering af RGB-kanaler, når du ville justere lysstyrken.
Praktiske tips
Design i HSL, når du har brug for systematiske nuancer og nuancer: bevar nuance og mætning, varier letheden i trin. Gem HEX til output, men gem HSL-notater i designfilen for fremtidige justeringer.
Hvordan man bruger det
- Åbn værktøjet. Alt kører i din browserfane.
- Indsæt eller skriv dit input, og vælg derefter den handling, du har brug for.
- Tjek resultatet og kopier det med et enkelt klik.
Almindelige spørgsmål
Hvorfor er min HEX-værdi anderledes i et andet værktøj?
Værdier er fastspændt til 0-255 og afrundet, derefter skrevet som store bogstaver HEX. Nogle værktøjer beholder små bogstaver eller ugyldige input.
Hvad er HSL?
En alternativ repræsentation: nuance i grader, mætning og lyshed i procent. Det er nyttigt til justering af farver.
Tjekker den kontrasten?
Nej. Dette konverterer farveformater; kontrastkontrol er et andet værktøj.
Er dette værktøj virkelig gratis?
Ja. Der er ingen konto, ingen betalingsmur og ingen forbrugsgrænse. Tools App er finansieret af aumenso, studiet bag.
Er noget, jeg indtaster, uploadet?
Nej. Værktøjet kører på din browserfane; det du indtaster bliver aldrig sendt til os og aldrig gemt.