A fresh CSS glow generator that generates cross-browser compatible code for your glowing needs.
adjust glow parameters
horizontal offset
vertical offset
blur
glow range
opacity
2dffc3
css code snippet
-webkit-box-shadow:0px 0px 104px 45px rgba(45,255,195,0.9);
-moz-box-shadow: 0px 0px 105px 45px rgba(45,255,195,0.9);
box-shadow: 0px 0px 105px 45px rgba(45,255,195,0.9);
About CSS Glows
Technically, there is no dedicated CSS property for glows. The box-shadow property, however, can be reappropriated to create hot glows for any HTML element.
Glows have a longstanding history within Internet Aesthetics. In line with the literal metaphors of Web 1.0, The “Deep Dark Web” was quite often literally visualized as a dark place, complete with dark UI (the original night mode) in which light text and glowing graphics glittered atop a dark, expansive backdrop. Yes bitches.
Of course, glows also have a history of being gratuitously used, and even maintain a somewhat of a bad reputation in many design circles. Some might even call glows the proverbial “Shia LaBeouf” of visual culture: captivating and magnetic, but also over-exposed and up-to-no-good.
Today, glowing objects are more prevalent in UI design than visual and graphic design. So called-neupmorphism, along with gamer UI, and other interactive backdrops rely on the glow as another tool for establishing and manipulating interface hierarchies.
All that to say, use the CSS glow cautiously, but have fun.
Good uses for CSS Glows
- Darker UIs
Of course, glows don’t work as well with lighter UIs – they require a darker background to truly shine. With that, glows become m - Attention
Glows are an easy way to grab attention, and animating glows further add to their captivating powers. Again, these effects are very easy to overdo, so be careful with the application. Attention works. - Power and Engery
The primary source of energy and life in this universe is the sun, and to some extent all glows play into this theme: the glow as a signal of energy, life-giving powers and even other-wordliness and the ability to transcend the physical world.
