Generator de degradeuri CSS
Ce este un degradeu CSS?
Degradeurile CSS vă permit să afișați tranziții fluide între două sau mai multe culori fără a utiliza fișiere imagine. Există trei tipuri: linear-gradient (de-a lungul unei linii drepte), radial-gradient (radiind dintr-un punct central) și conic-gradient (rotind în jurul unui punct central). Degradeurile sunt folosite pentru fundal, butoane, suprapuneri și elemente decorative.
Cum să utilizați generatorul de degradeuri CSS
-
Alegeți o presetare din mostre sau configurați propriul degradeu.
-
Alegeți tipul de degradeu: linear, radial sau conic.
-
Ajustați unghiul (pentru linear/conic) sau forma (pentru radial).
-
Editați punctele de oprire — schimbați culorile și pozițiile (0–100%).
-
Adăugați sau eliminați puncte de oprire după necesitate.
-
Copiați CSS-ul și lipiți-l în foaia dvs. de stiluri.
Întrebări Frecvente
Cum creez un gradient transparent? Utilizează valori de culoare rgba() sau hsla() cu un canal alfa de 0 pentru transparență completă. De exemplu, o oprire de culoare rgba(0,0,0,0) este negru complet transparent, util pentru suprapuneri cu fade-out pe imagini.
Cum creez o oprire de culoare grea (fără tranziție)? Plasează două opriri de culoare în aceeași poziție — una terminând și una începând în acel punct. De exemplu, red 50%, blue 50% creează o schimbare instantanee de la roșu la albastru la mijloc, fără tranziție de gradient.
Ce browsere acceptă gradiente conice? Gradientele conice sunt acceptate în toate browserele moderne (Chrome 69+, Firefox 83+, Safari 12.1+, Edge 79+). Nu sunt acceptate în Internet Explorer.
Pot folosi mai multe gradiente pe același element? Da. CSS background acceptă o listă separată prin virgulă de straturi. Puoi stivui gradiente, să le combini cu imagini de fundal și să controlezi independent poziția și dimensiunea fiecărui strat.
Keywords: generator degradeu CSS, gradient liniar, gradient radial, gradient conic, generator fundal CSS, selector culoare gradient, instrument gradient CSS