Die CSS Gradient Generator

Skep lineêre, radiale en kegelvormige CSS-gradiënte in jou blaaier.

Kleurstoppe

Gebruik die stopplekhante of sleutelbordpyle om posisies te wysig. Elke stopplek bevat 'n eksplisiete kleur, deursigtigheid en persentasie.

Gereed

Blaaier-eie plaaslike verwerking

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

Beperkte invoergrammatika

Die invoer aanvaar linear-gradient(), radial-gradient() of conic-gradient() met hekskleure en persentasies. Verklarings, URL's, veranderlikes en onbekende funksies word plaaslik verwerp.

Toeganklike terugval

Die gegenereerde CSS bevat 'n soliede agtergrondkleur-terugval saam met die gradiënt vir nie-ondersteunde weergawes en toeganklike beheerchrome.

Gereelde vrae

Word my gradiënt opgelaai?

Nee. Gradiënttoestand, kleure, ingevoerde CSS en gegenereerde CSS bly in jou blaaier.

Watter CSS-gradiënttipes word ondersteun?

Die genereerder skep linear-gradient(), radial-gradient() en conic-gradient()-uitset met verskeie hekskleurstoppies.

Wat kan ek invoer?

Die invoer aanvaar 'n doelbewus beperkte grammatika met een ondersteunde gradiëntfunksie, hekskleure, opsionele persentasies en beperkte hoek- of posisiewaardes.

Verwante ontwikkelaar- en ontwerpgereedskap

Gereedskap vir ontwikkelaarsBlai nutsmiddels CSS-kleur-omskakelaarSkakel CSS-kleure om SCSS SamestellerKompileer Sass/SCSS-brokkies aanlyn CSS-minifiseerderDruk CSS-kode plaaslik in jou blaaier saam. BeeldkleurkiesserKies kleure uit beelde plaaslik.

Die CSS Gradient Generator

Bou lineêre of radiale CSS-gradiënte en voorsien kleurstoppe, hoek, posisie, en herhaling.

Invoer
Gradiënt tipe, kleurstoppe, posisies, hoek en herhaal-instellings.
Uitgang
'n lewendige voorbeeld en kopieerbare CSS-agtergrondverklaring.
Werklike beperkings
Blaaier-weergawe kan effens verskil per enjin, en die gereedskap evalueer nie kontras of waarborg ondersteuning in ouer blaaiers nie.
Privaatheid en datahantering
gradientipe, kleur stops, posisie, hoek en herhaal instellings word verwerk in hierdie browser-kaap. Convertr 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. Verskaf gradiënttipe, kleurstoppe, posisies, hoek en herhaalinstellings in die instrumentbeheerders.
  2. Kies die instellings wat 'n regstreekse voorskou en kopieerbare CSS-agtergrondverklaring beïnvloed, en voer dan die instrument uit.
  3. Kyk 'n regstreekse voorskou en kopieerbare CSS-agtergrondverklaring voordat dit gekopieer of afgelaai word.

Algemene mislukkingsmodusse

'n Ontbrekende kleurstoppie, ongeldige kleur of onversoenbare posisie verhoed dat 'n geldige CSS-verklaring gebou word.

Nuttige voorbeeld

Skep 'n 90-grade lineêre gradiënt van #111827 teen 0% tot #f59e0b teen 100% en kopieer die verklaring.