Generator CSS Border Radius
Creează vizual border-radius CSS cu previzualizare în timp real și copiază cod gata de producție.
border-radius: —;
100% privat — totul rulează în browserul tău. Nimic nu este încărcat.
Despre Generator CSS Border Radius
CSS Border Radius Generator creează de la carduri rotunjite ușor până la forme organice de tip „blob”. Trage mânerele colțurilor direct pe previzualizare sau setează fiecare colț numeric — inclusiv sintaxa completă cu opt valori, unde fiecare colț are raze orizontale și verticale separate. Acea a doua axă este ceea ce deblochează ouă, frunze, picături și blob-uri.
Un comutator „link corners” menține toate cele patru colțuri sincronizate pentru o rotunjire uniformă clasică, în timp ce decuplarea lor eliberează fiecare colț pentru forme asimetrice. Douăsprezece presetări — rounded, pill, circle, squircle, două blob-uri, leaf, egg, arch, teardrop, petal și wave — demonstrează ce poate face proprietatea, iar un buton de randomizare generează forme organice noi la nesfârșit.
Poți schimba unitatea, poți recolora elementul și canvasul pentru a se potrivi design-ului tău și poți copia fie valoarea simplă border-radius, fie o regulă CSS completă. Instrumentul este 100% client-side — nimic nu este încărcat.
Cum să utilizați Generator CSS Border Radius
- Trage mânerele colțurilor pe previzualizare sau dezactivează „Link all corners” pentru a edita fiecare colț separat.
- Setează raza orizontală și verticală pentru fiecare colț, pentru forme organice, de tip blob.
- Alege unitatea și ajustează culorile elementului și fundalului pentru a previzualiza în context.
- Încearcă presetările — pill, squircle, blob, leaf, teardrop și altele — sau apasă randomize.
- Copiază valoarea border-radius sau CSS-ul complet.