Pastel CSS-gradiënt — Kant-en-klare code
Bouw CSS-gradiënten visueel op: lineair, radiaal of conisch type, hoekschuifregelaar en tot zes kleurstops met een live breed voorbeeldvenster en kopieerbare code.
Wordt volledig in uw browser verwerkt. Niets wat u hier invoert, wordt ooit geüpload.
Resultaat
Over dit hulpmiddel
Deze pagina opent de gradiëntgenerator met een kant-en-klare pasteloverloop ingeladen: poederroze #ffdde1 dat overvloeit in oudroze #ee9ca7. Het voorbeeldpaneel toont het zachte resultaat direct en de CSS-regel staat eronder klaar.
Pastelgradiënten werken daar waar verzadigde gradiënten zouden schreeuwen: onboarding-schermen, kaarten, lege toestanden en beauty- of lifestylebranding. Omdat beide stops licht zijn, blijft donkere tekst leesbaar over het hele oppervlak — iets wat de meeste felle gradiënten niet kunnen bieden zonder een overlay.
Kopieer de regel zoals hij is of maak hem zachter door trucjes met opaciteit toe te passen: verplaats de roze stop naar 80% en laat het roze domineren, of schakel over naar een radiaal type voor een zachte kern. De tool werkt de kopieerbare CSS bij elke invoer bij.