Gratis online CSS-gradientgenerator. Design lineære, radiale og koniske gradienter visuelt, og kopiér derefter CSS-koden med det samme.
Hvordan bruger man Gradientgenerator?
Vælg gradienttype (lineær, radial osv.).
Tilføj farvestop, og indstil farver.
Kopiér den genererede CSS-kode.
Ofte stillede spørgsmål om Gradientgenerator
Hvilke gradienttyper understøttes?
Lineære, radiale og koniske gradienter understøttes.
Kan jeg kopiere CSS-koden direkte?
Ja, kopiér den genererede CSS-gradientkode med ét klik for at anvende den direkte på dit websted.
Hvorfor opstår der et grumset gråt bånd midt i min gradient?
Når to farver ligger over for hinanden i cirklen, passerer blandingen et punkt, hvor mætningen falder næsten til nul, og det ses som et mat gråt bånd. Parrene blå-orange og rød-grøn er de sædvanlige syndere. At lægge en tredje farve ind som mellemstop fører overgangen uden om det grå, og to nabonuancer fjerner problemet fra begyndelsen.
Kan jeg gemme gradienten som billedfil og ikke kun som CSS?
Ja, du kan hente en PNG og bruge den direkte som slidebaggrund, billede til sociale medier eller trykt layout. Til en webside er CSS dog bedre: der er ingen fil at hente, gradienten strækker sig til enhver skærmstørrelse uden at knække, og den viser aldrig den trappekant, en opskaleret bitmap får.
Tips til effektiv brug af Gradientgenerator
Bland to nuancer, der ligger tæt på farvecirklen – modsatte farver bliver snavset grå i midten.
En diagonal på 135 grader er det sikreste valg til bannere og kortbaggrunde.
Skal der ligge tekst ovenpå, så tjek kontrasten mod det lyseste farvestop.