Generator de gradin CSS
Creați gradiente CSS lineare, radiale și conice în browser-ul dvs.
Culoare Stop
Folosește manuscrisele de oprire sau rafturile de tastatură pentru a edita pozițiile. Fiecare oprire include o culoare explicită, opacitate și procentaj.
Procesarea locală nativă
Gradientul rămâne în acest browser. nu sunt trimise culori sau CSS generate către Converter.
Gramatică limitată
Importul acceptă gradient linear(), radial-gradient(), sau conic-gradent() cu culori și procente hex. Declarațiile, URL-urile, variabilele și funcțiile necunoscute sunt respinse local.
Accesibilă de faliment
CSS generat include un cadru solid de culoare de fundal, alături de gradant pentru rendereri neînsoțite și Chrome de control accesibil.
Întrebări frecvente
A fost încărcat gradantul?
Starea gradului, culorile, CSS importat și CSS generat rămân în browser-ul dvs.
Ce tipuri de gradatoare CSS sunt susținute?
Generatorul creează o producție linear-gradient(), radial-gradent() și conic-graduent().
Ce pot să import?
Importul acceptă un grammar deliberat limitat folosind o funcție gradientă susținută, culori hex, procente opționale și valori de unghi sau poziție limitate.
Dezvoltator și instrumente de design
Generator de gradin CSS
Construiți gradiente CSS lineare sau radiale și previzionați stopurile de culoare, unghiul, poziția și repetarea.
- Intrare
- Tip de gradare, oprirea culorilor, pozițiile, unghiile și setările repetate.
- Ieșire
- O imagine de referință și o declarație de fundal CSS copiabilă.
- Limitări reale
- Renderarea browserului poate diferi ușor de la motor, iar instrumentul nu evaluează contrastul sau garantează suport în browserele moștenite.
- Privacitatea și prelucrarea datelor
- tipul de gradare, stopurile de culoare, pozițiile, unghiile și setările repetate sunt prelucrate în această pagină de browser. Converter nu primește sau stocă; închiderea sau reîncărcarea paginii clarifică starea de lucru, cu excepția cazului în care instrumentul oferă explicit o descărcare locală.
Cum să utilizați acest instrument
- Oferă tipul de gradant, stopurile de culoare, pozițiile, unghiile și setările repetate în controlurile instrumentului.
- Alegeți setările care afectează o preview live și o declarație de fundal CSS copiabilă, apoi rulați instrumentul.
- Revizuiți o preview live și o declarație de fundal CSS copiabilă înainte de a o copia sau descărca.
Moduri comune de eșec
O oprire a culorilor, o culoare inadecvată sau o poziție incompatibilă împiedică construirea unei declarații valabile CSS.
Exemplu util
Creați un grad linear de 90 de grade de la #111827 la 0% la #f59e0b la 100% și copiați declarația.