Beste gratis CSS-kleurverloopgenerator
Bouw lineaire en radiale CSS-gradiënten met een live preview. Kopieer de achtergrondcode.
100% vrij
Geen aanmelding
Geen watermerk
✨
Ga Pro voor de beste AI modellen - afbeelding, video en chat - plus grotere uploads, prioriteit in de wachtrij en geen wachten.
Upgrade naar Pro
Liefde Best.Free? Deel het
Hoe het werkt
- Kies een type. Kies lineair of radaal en stel de hoek in voor een lineair verloop.
- Kleuren en stops kiezen. Stel twee of meer kleuren in en hun posities; voeg een derde stop toe in Advanced opties.
- Kopiëren van het CSS. Druk op CSS kopiëren en plak het achtergrondverloop in je stylesheet.
Info over dit hulpprogramma
Bouw een CSS-gradiënt voor ogen in plaats van een blindwaarde te bewerken. Schakel over tussen lineair en radaal, sleep de hoek voor een lineair verloop en kies kleuren en posities voor minstens twee stops terwijl een voorbeeldbalk met volledige breedte live wordt bijgewerkt. Kopieer de resulterende achtergrondeigenschap rechtstreeks in je stylesheet. De Advanced-opties voegen een derde kleurstop toe voor rijkere mengsels en laten je een cirkel- of ellipsvorm kiezen voor radiale gradiënten. Het draait allemaal in je browser.
Waarvoor gebruiken mensen het?
- Ontwerp een held of sectie achtergrondverloop
- Een knop of kaartverloop aanmaken
- Twee of drie merkkleuren soepel mengen
- Een radiale spot of vigneteffect genereren
Veelgestelde vragen
Een lineair verloop gaat over een rechte lijn onder de door u gekozen hoek; een radiale gradiënt gaat naar buiten vanuit een middelpunt als cirkel of ellips.
Voor een lineair verloop stelt de hoek de richting van de blend in
Elke stop is een kleur die op een percentage wordt geplaatst langs de helling. Het verplaatsen van een stop verandert waar die kleur zit en hoe scherp de mix is.
Ja. Open Geavanceerde opties om een derde kleurstop toe te voegen, tussen de eerste en laatste voor een multi-kleurenmix.
Nee. De kleuren en stops worden lokaal in uw browser omgezet in een CSS-tekenreeks.
Volledig gratis, geen account en geen grenzen.. een client-side tool met niets te meten.
Ja. Het draait in uw browser, dus CSS Gradient Generator werkt op telefoons en tablets, evenals desktop.. Er is geen app te installeren.
Meestal slechts een paar seconden voor een typisch bestand.. CSS Gradient Generator begint te werken het moment dat u uw invoer.
Het gebruik van de mutsen is onbeperkt, onder een royale pet die het voor iedereen snel houdt.
Alle moderne browsers.. Chrome, Safari, Firefox en Rand. CSS Gradient Generator hoeft niets geïnstalleerd buiten de browser die u al gebruikt.