DEV Community

loading...
Cover image for CSS Light Saber

CSS Light Saber

Oryam
Junior Web developer
・1 min read

Inspired by lynn fisher and this live streaming video with her,
I created:

Single div Lightsaber

In CSS, there are three layers: the selector, :before, and :after.
In this case the “div” holds the blade, the :before holds the hilt and the :after holds the button.
The drawing was made with color-gradients inside a background-image.

Discussion (0)