In case it's not obvious, using glass-look comes with some tradeoffs. Why? Well, let's just say without appropriate blurring, glass can be a bit. While the numerical majority of your website users will likely be on a blink or webkit based browser, there are still enough people using Firefox as their daily driver that you should consider them. Oh wait, but you want to jump on the glass train, don't you? It's that shiny-new-thing smell, isn't it? Now, this is probably not such a big deal to most designers, because y'all don't use glass anyway, haha. Truth is, quite a large number of users are using Firefox, and even the latest Firefox release (as of the time of writing) does not support the backdrop-filter: property in any context (unless you're willing to turn on some features in about:config). It's *not* supported everywhere! I know this comes as a shock, so if you need a moment. With the resurgence (was it ever popular though?) of glass/glass-look in UI design, having a blurry backdrop on your page elements has become all the rave.īUT! There's something you should know before you dive in. The above example uses backdrop-filter: blur(8px). As you can tell by the title, I'm going to be focusing on a rather exciting, "new" CSS property: backdrop-filter:, specifically using the function blur(). I've been favouring glass-style designs since I could poke around in MS Frontpage.Īnyway, that's not the point of this post. a while (guess), I feel kind of like I've been ahead of the curve on this one. Having been around in the web design space for. it's rather popular to go for a "glass look" in your designs. ![]() At the the time of writing (this will probably change in the future).
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |