CSS gradient generator
Skap lineære, radiale og koniske CSS-gradienter i nettleseren din.
Fargestopp
Bruk stopphåndtakene eller tastaturpilene for å redigere posisjoner. Hvert stopp inneholder en eksplisitt farge, opasitet og prosentandel.
Nettleser-native lokal behandling
Gradientene dine er i denne nettleseren. Ingen farger eller genererte CSS sendes til Convertr.
Begrenset innføringsgrammatikk
Importen aksepterer linear-gradient(), radial-gradient() eller conic-gradient() med hex-farger og prosent. Deklarasjoner, URL-er, variabler og ukjente funksjoner blir avvist lokalt.
Tilgjengelig fallback
Den genererte CSS-en inneheld ein einsfarga reserveverdi for background-color i tillegg til gradienten, for renderarar som ikkje støttar han, og gir ei tilgjengeleg utforming av kontrollane.
Ofte stilte spørsmål
Er gradienten min lastet opp?
Gradient status, farger, importerte CSS og generert CSS forblir i nettleseren din.
Hvilke CSS gradienttyper støttes?
Generatoren skaper lineær-gradient(), radial-gradient() og konisk-gradient() utgang med flere hex-fargestopp.
Hva kan jeg importere?
Importen aksepterer en bevisst begrenset grammatikk ved hjelp av en støttet gradientfunksjon, hex-farger, valgfrie prosentandeler og begrensede vinkel- eller posisjonsverdier.
CSS gradient generator
Bygg lineære eller radiale CSS-gradienter og forhåndsvis fargestopp, vinkel, posisjon og repetisjon.
- Inndata
- Gradienttype, fargestopp, posisjoner, vinkel og gjentakelsesinnstillinger.
- Utdata
- En live-forhåndsvisning og kopierbar CSS-bakgrunnserklæring.
- Reelle begrensninger
- Nettlesergjengivelse kan variere litt etter motor, og verktøyet vurderer ikke kontrast eller garanterer støtte i eldre nettlesere.
- Personvern og databehandling
- gradert type, farge stopper, posisjoner, vinkler og gjentatte innstillinger behandles i denne nettleser-tabellen Convertr mottar ikke eller lagrer det; lukking eller omlasting av siden avslører arbeidsstatus med mindre verktøyet uttrykkelig tilbyr en lokal nedlasting.
Hvordan bruke dette verktøyet
- Oppgi gradienttype, fargestopp, posisjoner, vinkel og gjentakelsesinnstillinger i verktøykontrollene.
- Velg innstillingene som påvirker en direkte forhåndsvisning og kopierbar CSS-bakgrunnserklæring, og kjør deretter verktøyet.
- Se en live forhåndsvisning og kopierbar CSS-bakgrunnserklæring før du kopierer eller laster den ned.
Vanlige feiltyper
En manglende fargestopp, ugyldig farge eller uforenlig posisjon forhindrer en gyldig CSS-deklarasjon fra å bli bygget.
Nyttig eksempel
Lag en 90-graders lineær gradient fra #111827 ved 0% til #f59e0b ved 100% og kopier erklæringen.