CSS gradient-generator

Funksjoner i CSS gradient-generator

• 01

  Lineær, radiell og konisk

  Lineær er den daglige bakgrunnsgradienten; radiell er flott for høydepunkter og vignettering; konisk er perfekt for sektordiagrammer, fargehjul og roterende bakgrunner.

• 02

  Opptil seks fargestopper

  Legg til og fjern stopper, angi hver ones posisjon med en skyver, og velg dens farge via systemfargevelgeren eller en hex-verdi. Stopper blir automatisk omsortertert etter posisjon.

• 03

  Kopierbar CSS-erklæring

  Utgangen er en komplett background: ... erklæring som du kan lime inn direkte i et stilark, en stilkomponent eller en Tailwind vilkårlig-verdi klasse.

Vanlige spørsmål om CSS gradient-generator

Hva er forskjellen mellom lineær, radiell og konisk?

Lineære gradienter kjører i en rett linje i en gitt vinkel; radielle gradienter sprer seg utover fra et sentrum; koniske gradienter feier rundt et punkt som en klokkehånd. Hver passer til en annen visuell effekt.

Hvor mange fargestopper skal jeg bruke?

To stopper er den klassiske tofargegradient. Tre eller fire lar deg lage realistiske overganger (solnedgang, aurora). Mer enn seks har en tendens til å se støyende ut — det er derfor denne generatoren begrenses til seks.

Kan jeg bruke dette for bakgrunner i en e-postmal?

De fleste e-postklienter støtter fortsatt ikke moderne CSS-gradienter pålitelig — gi en fast fallback-farge i tillegg til bakgrunnsgradienten hvis du kopierer dette til en e-postmal.

Er utgangen piksel-nøyaktig?

Ja — forhåndsvisningen gjenngis av nettleserens native gradient-motor, så det du ser er det CSSen din vil produsere.