01
Når dette verktøyet er nyttig
Bruk dette for å lage en webbakgrunn med to farger eller en card-aksent. Velg start- og sluttfarger, en lineær eller radial type og en vinkel for å få både forhåndsvisning og CSS.
Gradientgenerator
Generer linear-gradient- eller radial-gradient-kode med forhåndsvisning i sanntid.
Gradientgenerator
Et resultat i nettleseren for planlegging og referanse.
Hva du bør sjekke før bruk
02
Hvordan resultatet blir laget
Den lineære modus lager en linear-gradient med den valgte vinkelen; den radielle modus lager en sirkulær radial-gradient. Nettleseren gjengir mellomfargene mellom de to stoppunktene.
03
Arbeidseksempel og tolkning
Still inn #3366FF til #FF6655 ved 90 grader for en venstre-til-høyre bakgrunnsdeklarasjon. Kopier det inn i den faktiske komponenten og kontroller kontrasten for teksten som ligger over på nytt.
04
Omfang og begrensninger
Generatoren bruker to fargestopp og kan ikke fjerne forskjeller i fargeinterpolasjon mellom nettlesere. Legg til komplekse stopp, alpha-overganger eller wide-gamut-farger i en fullverdig editor.
Vanlige sporsmal
Hvordan flytter jeg en farge fra Gradientgeneratoren til en annen app?
Bruk kopieringsknappen under resultatet for å kopiere CSS-, HEX- eller HSL-tekst. Bekreft at målappen tolker samme fargeformat.
Vil en skjermfarge fra Gradientgeneratoren samsvare med utskrift?
Ikke automatisk. Emissive RGB-skjermer og reflekterende papir og blekk bruker ulike gamutter og blandingsmodeller, så utskriftsprofiler og proofs er fortsatt nødvendige.
Kan jeg godkjenne et design-token bare fra Gradientgeneratoren alene?
Bruk det som en kandidat, test deretter den faktiske bakgrunnen, mørk modus, interaksjonstilstander og tekstkontrast før du navngir og godkjenner et token.