Fargepaletter

Generator for fargenyanser

Velg en farge og få med en gang hele skalaen, fra den lyseste nyansen til den mørkeste. Trykk på en nyanse for å kopiere HEX-koden.

Skala fra 50 til 950

Elleve nyanser fra samme fargefamilie, nummerert som i Tailwind. Fargen din er markert på trinnet som passer best.

Lyse nyanser (med hvitt)

Trykk på en nyanse for å kopiere HEX-koden.

Mørke nyanser (med svart)

Brutte nyanser (med grått)

Eksporter skalaen

Hva er en fargeskala

Det er rekken av nyanser som kommer fra én farge: fra en nesten hvit versjon til en nesten svart. Alle har samme grunntone, så de passer alltid sammen.

Lyse, mørke og brutte nyanser

En lys nyanse er fargen blandet med hvitt: lysere og mykere. En mørk nyanse er fargen blandet med svart: mørkere og dypere. En brutt nyanse er fargen blandet med grått: mer dempet og elegant.

Slik bruker du en skala i designet ditt

Bruk de lyse trinnene (50 til 200) til bakgrunner, de midterste (400 til 600) til knapper og lenker, og de mørke (700 til 950) til tekst og kanter. Med én skala får du et ryddig og enhetlig grensesnitt.

Vanlige spørsmål

Hvordan beregnes skalaen?

Vi bruker fargerommet OKLCH, som følger hvordan øyet oppfatter lyshet. Det gjør trinnene mellom nyansene jevne, uten brå hopp.

Hva betyr tallene 50 til 950?

Det er skalaen som Tailwind CSS og mange designsystemer bruker: 50 er den lyseste nyansen og 950 den mørkeste. Fargen din havner på tallet som passer best.

Kan jeg bruke skalaen i Tailwind eller CSS?

Ja. Skriv et navn, velg format og kopier koden: CSS-variabler klare til å lime inn, eller fargeblokken til Tailwind-konfigurasjonen din.

Hva er forskjellen på en fargeskala og en fargepalett?

En skala er nyanser av én farge. En palett kombinerer ulike farger som passer sammen. Mange paletter bruker en skala til bakgrunner og tekst, pluss én eller to aksentfarger.

Andre guider og verktøy