Generator Neumorphism
Proiectează suprafețe UI neumorfice, moi și reliefate, cu umbre duble și copiază CSS-ul.
—
Fundalul potrivește culoarea elementului — asta este ceea ce face ca aspectul neumorfic, moale și reliefat, să funcționeze.
În mod implicit, umbrele deschise și închise sunt derivate din culoarea de bază. Activează pentru a le seta manual.
Despre Generator Neumorphism
Neumorphism Generator creează aspectul moale, extrudat, de tip „soft UI”: un element care pare apăsat în afară — sau în interior — din suprafața din spatele lui. Alege o singură culoare de bază, iar instrumentul derivă tot restul, pentru că efectul funcționează doar atunci când elementul și fundalul său au aceeași culoare, iar profunzimea vine în totalitate din două box-shadow-uri opuse.
Sliderele controlează geometria: dimensiunea, raza colțurilor, distanța umbrelor, intensitatea și blur-ul lor. Patru moduri de formă — flat, concave, convex și pressed — schimbă gradientul intern și direcția umbrei, iar un selector de sursă de lumină mută punctul de reflexie în oricare dintre cele patru colțuri, astfel încât elementul să se potrivească cu iluminarea design-ului tău.
Implicit, culorile umbrei deschise și închise sunt calculate din culoarea de bază, dar un mod manual îți permite să le setezi pe amândouă tu însuți. CSS-ul generat — background, radius și cele două box-shadow — e la un singur click distanță.
Cum să utilizați Generator Neumorphism
- Alege culoarea de bază — se aplică atât elementului, cât și canvasului din spatele lui.
- Alege o formă: flat, concave, convex sau pressed.
- Setează colțul sursei de lumină pentru a controla unde cade reflexia.
- Ajustează dimensiunea, raza colțurilor, distanța, intensitatea și blur-ul cu ajutorul sliderelor.
- Activează culorile de umbră manuale dacă vrei să suprascrii tonurile deschise și închise derivate automat.
- Copiază CSS-ul și lipește-l pe elementul tău.