Glassmorphism je posebna oblika designa, ki posnema videz zamrznjenega stekla: prosojni elementi, zamegljena podlaga, mehki robovi in subtilne sence. Gre za sodoben dizajnerski trend, ki združuje minimalizem, globino in eleganco.
Učinek je še posebej priljubljen v mobilnih aplikacijah, nadzornih ploščah (dashboardih), karticah (cards), navigacijah, modalnih oknih, …
Kaj je Glassmorphism?
Glassmorphism je: polprosojen dizajn, z zamegljeno podlago (blur), in svetlobnimi odsevi, ki ustvarja občutek stekla nad ozadjem.
Glavne značilnosti:
- Prosojnost
- zamegljen background
- mehki robovi
- tanka bela obroba
- subtilna senca
Vizualno daje vtis globine in plastenja elementov. Danes lahko ta design najdemo v iOS, mac OS, Android, spletnih aplikacijah, … običjano se uporablja za obvestila, widgete, okna, menije, kartice, …
Glassmorphism ni dobra izbira, če imamo zelo kontrastno ali kaotično ozadje, rabimo stare brsklanike, če je dostopnost (kontrast besedila) pomembna, če želimo minimalističen design. Glassmorphism je nekaterim lep, ni pa vedno funkcionalno najboljša rešitev.
CSS primer
Za lažjo uporabo tega designa sem pripravil malo orodje, ki omogoča hitro izgradnjo različnih oblik glassmorphism.
See the Pen
CSS: Glassmorphism by Ziga (@pomagalnik)
on CodePen.
