Die CSS Gradient Generator

Maak lineêre, radiale en koniese CSS-gradiente in jou browser.

kleur stop

Gebruik die stop handels of keyboard stryd om posisies te bewerk. Elke stop bevat 'n uitdrukkelike kleur, onwaarheid en percentage.

Gereed

Browsers-native plaaslike verwerking

Jou gradient bly in hierdie browser. Geen kleur of geskep CSS word na Converter gestuur nie.

Beperkte grammatiek

Die importe aanvaar lineêre gradient(), radiale gradiente(), of koniese gradiënt() met hex kleur en percentages. verklarings, URL's, variabele en onbekende funksie word lokaal afgewyk.

Die toeganklike Fallback

Die generasie CSS bevat 'n solide agtergrond-kleur-fallback saam met die gradient vir ondersteunte renderers en toeganklike beheer chrome.

Gereelde vrae

Is my gradient opgehef?

No. Gradient toestand, kleur, ingevoerde CSS, en geskep CSS bly in jou browser.

Welke CSS gradienttype word ondersteun?

Die generator skep lineêre gradient(), radiale gradiente(), en koniese gradiënt() uitgang met verskeie hex kleur stops.

Wat kan ek impor?

Die importer aanvaar 'n gewillig beperkte grammatiek met 'n ondersteunde gradientfunksie, hex kleur, optiewe percentages en beperkte hoek of posisie waarde.

Die CSS Gradient Generator

Maak lineêre of radiale CSS gradiente en voorspel kleur stops, hoek, posisie, en herhaling.

Invoer
Gradient tipe, kleur stops, posisie, hoek en herhaal instellings.
Uitgang
'n live voorbeeld en kopieerbare CSS-grondgrondverklaring.
Real beperkings
Browsers rendering kan enigszins afskekend word deur die motor, en die gereedskap evalueer nie kontraste of waarborg ondersteuning in erfgoed browsers.
Privaciteit en data verwerking
gradientipe, kleur stops, posisie, hoek en herhaal instellings word verwerk in hierdie browser-kaap. Converter ontvang dit nie of bewaar dit nie; sluit of herloot die bladsy verduidelik die werkstyd tenzij die gereedskap uitdruklik 'n plaaslike download bied nie.

Hoe om hierdie instrument te gebruik

  1. Gee gradient type, kleur stops, posisies, hoek, en herhaal instellings in die instrument beheers.
  2. Kies die instellings wat 'n live voorbeeld en kopieerbare CSS-bakgrondeverklaring beïnvloed, en voer dan die werktuig.
  3. Kyk 'n live voorbeeld en kopieerbare CSS-grondgrondverklaring voordat dit kopieerd of gedownload word.

Die algemene mislukingsmodus

'N gebrek aan kleur stop, onvoldoende kleur of incompatibele posisie voorkom dat 'n geldig CSS-verklaring word gebouw.

Gebruiklike voorbeeld

Maak 'n 90 grades lineêre gradient van #111827 by 0% tot #f59e0b by 100% en kopieer die verklaring.