The Problem If you’re like me you get random ideas for ways to structure html or new ways to build something with css. In the process I always want to quickly add some colors whether to test some design element or just highlight an element using it’s background or border. This is quick prototyping so …
Shadowy Pixels
Recently I came across a new CSS library called NES.css which is designed to mimic retro games from systems like NES and Gamecube. Below are some examples of the library showing off the pixelated style so recognizable with retro games. The second I found this library I wanted to help it grow and make it …
CSS Dual Pendulum
Simple CSS based dual pendulum
Stacking Gradients
In case you didn’t know you can stack backgrounds in CSS. This is especially useful with gradients. Technically you’re stacking the background-image property but the background shorthand property works just as well. To do this just list all the gradients, colors, images, etc. that you want separated by spaces. The backgrounds will be applied stacked …
Dynamic Hexagon Grid
Code snippet to quickly build a hexagonal grid in pure css/html
CSS Layout Cheatsheets
http://grid.malven.co/ http://flexbox.malven.co/ As you may or may not know CSS3 added two very powerful CSS layout methods called Grid and Flexbox. If you’ve used either of these or both before you’ll likely know there are many of properties that guide each. These can be hard to remember so people have created cheatsheets to help quickly …