CSS Gradient Generator
Opret smukke CSS-gradienter gratis online. Design lineære og radiale gradienter med flere farvestop og kopiér CSS-koden med det samme.
Preview
CSS Code
Sådan fungerer det
- Vælg gradienttype – lineær eller radial – afhængigt af dit designbehov.
- Tilføj farvestop ved at klikke på skyderen og vælg farver fra farvevælgeren.
- Juster vinklen eller retningen på gradienten med rotationskontrollen.
- Se resultatet i realtid i forhåndsvisningsområdet.
- Kopiér den genererede CSS-kode med ét klik og indsæt den direkte i dit projekt.
Eksempel
Input: Lineær gradient: fra #667EEA (0%) til #764BA2 (100%), vinkel 45°
Resultat: background: linear-gradient(45deg, #667EEA 0%, #764BA2 100%);
FAQ
Ja, al behandling sker direkte i din browser. Ingen data sendes til nogen server, så din arbejdsgang forbliver fuldt privat.
Ja, du kan tilføje et ubegrænset antal farvestop for at skabe komplekse flerfarvede gradienter.
Den genererede kode er kompatibel med alle moderne browsere. Værktøjet tilføjer automatisk de nødvendige præfikser for bredere kompatibilitet.
En lineær gradient forløber fra én farve til en anden langs en ret linje, mens en radial gradient spreder sig fra et centralt punkt ud i en cirkulær form.