CSS Gradiënten Genereren — Mooie Achtergronden Zonder Moeite

CSS-gradiënten zijn krachtige achtergrondtechnieken die vroeger afbeeldingen vereisten. Onze generator laat je gradiënten visueel bouwen en genereert direct bruikbare CSS-code.

Lineaire, radiale en conische gradiënten

Lineaire (linear-gradient()) verlopen in een rechte lijn. Radiale (radial-gradient()) stralen vanuit een middelpunt. Conische (conic-gradient()) draaien rond een punt — ideaal voor taartgrafiekeffecten.

Kleurstops en posities

Kleurstops bepalen waar een kleur start of eindigt. Meerdere stops maken meerkleurige gradiënten. Harde overgangen door twee stops op dezelfde positie: #ff0000 50%, #0000ff 50%.

Gradiënten combineren

Meerdere gradiënten gestapeld met komma's creëren complexe patronen. repeating-linear-gradient() herhaalt een patroon. Animeer gradiënten via background-position voor vloeiende kleurveranderingen.