Pure CSS3 Star Wars Lightsaber Checkboxes. This is a quick fun little project built to demonstrate the power behind CSS3, and an awesome little checkbox hack (:checked ~ div). Not “too” practical for UI/UX, but overall some cool code. It features four different lightsabers: Yoda’s, Darth Vader’s, Obi-Wan’s, and Mace Windu’s.
These Lightsaber checkboxes have a bunch of neat cool features and subtle little tricks. Some of them are:
2. Plain and Simple. More for fun, less for UI/UX.
3. Four different Lightsaber colors. Supporting green for Yoda, red for Darth Vader, blue for Obi-Wan Kenobi, and purple for Mace Windu.
4. On and off switches. The handle will have a green button for on and red for off.
5. These checkboxes are optimized for Webkit browsers, but work in all modern browsers. It supports IE9 and above.
6. Finally, it’s governed under the MIT Open-Source License. It’s free to use, modify, or whatever. Please attribute though.